在Div ID中设置Div类

Question

我有一个包含以下div元素的页面：

<div id="name" class="class_name">

我应该使用以下哪个来设置课程的样式？

#name .class_name
name .class_name
#name class_name

Answer 1

仅#name就足以将样式仅应用于该特定元素：

#name {
   // your styles here
}

如果要使用class_name类将样式应用于所有元素，则可以使用：

.class_name {
   // your styles here
}

Answer 2

#name .class_name将应用于.class_name类的div的children元素。

之间一定不能有任何空格。

您应该使用：#name.class_name，因为它是正确的语法。

但是，使用标识符时，单独使用它就足够了。

#name {
  // some properties
}

但是假设你有一个独特的块，它继承了一些泛型样式，那么你可以使用＃idenifier.class来混合样式。

#comments {
    width: 453px;
}

#comments.links
{
   border: 0 none;
}

Answer 3

如果我的问题正确，请使用

#name .class_name

，如

#name .class_name {
    color:#000;
}

但实际上你不需要这样做。 如果在该div中使用#name和.class_name，则可以删除.class_name。否则，如果您使用.class_name的多个与div #name不具有相同属性的内容，则应将它们分开。

.class_name {
    color:#000;
}
#name {
    width:600px;
}

Answer 4

ID应该是唯一的，因此在设置div的id和class_name时没有多大意义。

如果这是你的目标，只需使用div的ID即可。

#name
{
   //styles
}

如果要为具有该类名的每个div设置样式，请使用

.class_name
{
   //styles
}

Answer 5

您可以在此处阅读CSS选择器：

http://reference.sitepoint.com/css/selectorref

在CSS中，您可以按类引用它：

.class_name { color: green; }

或使用#id

的id

#name { color: green; }

或按元素类型

div { color: green; }

//或上述

的组合

div.class_name { color: green; }
div#name { color: green; }

Answer 6

如果您已经设置了＃name和.class_name样式，但出于某种原因，您想要设置样式

<div id="name" class="class_name"></div>

（即id为“name”且类为“class_name”的元素的特定样式），可以使用

#name.class_name {
/* note the absence of space between the id and class selector */
    ...
}

请记住，Internet Explorer 6不支持此选择器。