Html 如何选择带空格的班级
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6885013/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to select classes with spaces
提问by Rails beginner
How do I select a class like class="boolean optional"?
我如何选择一个类class="boolean optional"？
I have tried this:
我试过这个：
.boolean optional {CSS}
.boolean_optional {CSS}
回答by BoltClock
As Zepplock says, that's actually two classes in a single attribute: booleanand optional. The space is not part of a class name; it acts as the separator.
正如 Zepplock 所说，这实际上是一个属性中的两个类：boolean和optional。空格不是类名的一部分；它充当分隔符。
These three selectors will all match it:
这三个选择器都会匹配它：
.boolean
.optional
.boolean.optional
The last selector only picks up this element as it has bothclasses.
最后一个选择器只选择这个元素，因为它有两个类。
You neverinclude a space when chaining class selectors, not even like this:
你从来没有链接类选择的时候，甚至没有像这样包括空间：
.boolean .optional
As that selects .optionalelements that are contained within separate .booleanelements.
因为它选择.optional包含在单独.boolean元素中的元素。
回答by brezanac
Those are not classes with spaces :) They are called multiple class selectors.
这些不是带空格的类 :) 它们被称为多类选择器。
You basically just need to make sure all the class names are connected (no spaces between them) and separated with a dot.
你基本上只需要确保所有的类名都是连接的（它们之间没有空格）并用点分隔。
.boolean.optional {
}
回答by phihag
Spaces are not valid in class name. class="boolean optional"means the element has the classes booleanandoptional, so you can match it with either .boolean, .optional, or if you want to match only objects that are both optional and boolean, with .boolean.optional.
类名中的空格无效。class="boolean optional"表示元素具有类booleanandoptional，因此您可以将其与.boolean,匹配.optional，或者如果您只想匹配既可选又是布尔值的对象，则使用.boolean.optional.
回答by ckittel
Classes will never actually have spaces in their name. In your example, that is actually two classes; booleanand optional.
类的名称中实际上永远不会有空格。在您的示例中，这实际上是两个类；boolean和optional。
to apply style to an element that has both of those classes, the construct is
要将样式应用于具有这两个类的元素，构造是
.boolean.optional {
/* CSS */
}
However, IE6 is known to have some issues with this. See this linkfor more details on known quirks.
但是，已知 IE6 对此存在一些问题。有关已知怪癖的更多详细信息，请参阅此链接。
回答by Small Business Helper Swansea
I appreciate this was a while ago, but in case anyone's interested, something I've found handy also is, how to target/select an element within an element which has both classes... EXAMPLE
我很欣赏这是前一段时间，但如果有人感兴趣，我发现也很方便的是，如何在具有两个类的元素中定位/选择一个元素......示例
.boolean.optional > p {
color: red;
}
Perhaps requires no explanation, but: turns 'paragraph text red' ONLY for paragraph's inside of elements where both classes exist i.e.both .boolean AND .optional
也许不需要解释，但是：仅针对两个类都存在的元素的段落内部即 .boolean 和 .optional 将“段落文本红色”变为红色
