如何选择带空格的类

Question

如何选择class="boolean optional"等类？

我试过这个：

.boolean optional {CSS}

.boolean_optional {CSS}

Answer 1

正如Zepplock所说，这实际上是一个属性中的两个类：boolean和optional。该空间不是类名的一部分;它充当分隔符。

这三个选择器都匹配它：

.boolean
.optional
.boolean.optional

最后一个选择器只选择这个元素，因为它有两个类。

在链接类选择器时，从不包含空格，甚至不是这样：

.boolean .optional

因为它会选择.optional元素中包含的.boolean元素。

Answer 2

那些不是带空格的类:)它们被称为多类选择器。

您基本上只需要确保所有类名都已连接（它们之间没有空格）并用点分隔。

.boolean.optional {

}

Answer 3

空格在班级名称中无效。 class="boolean optional"表示该元素包含类boolean 和 optional，因此您可以将其与.boolean，.optional或如果你想只匹配可选和布尔的对象，.boolean.optional。

Answer 4

类的名称实际上永远不会有空格。在你的例子中，这实际上是两个类; boolean和optional。

将样式应用于具有这两个类的元素，构造是

.boolean.optional {
 /* CSS */
}

但是，已知IE6存在一些问题。有关已知怪癖的详细信息，请参阅this link。

Answer 5

我很欣赏这一段时间，但是如果有人感兴趣的话，我发现的方法也是，如何在一个元素中定位/选择一个元素同时具有两个类... 实施例

.boolean.optional > p {
    color: red;
}

也许不需要解释，但是：将'段落文本变为红色'仅适用于存在两个类的元素内部的段落，即两个.boolean AND .optional