有没有办法在CSS中查询具有多个类的元素？

Question

如何查询同时包含两个类的元素？

例如：

<div><span class="major minor">Test</span></div>

我想要同时设置所有具有“主要”和“次要”类别的跨度。

Answer 1

以下应该可以解决问题：

span.major.minor { color: red; }

请注意，使用Internet Explorer 6时必须小心 - 它只会读取选择器的最后一个类。例如，它会错误地将上述规则应用于以下内容：

<span class="minor">Test</span>

Answer 2

使用类限定符两次，例如：

.major.minor { ... }

<强>但即可。它在IE6中不起作用（或在Quirks Mode中的IE7中）。当您在同一元素上指定多个类选择器时，IE仅关注最后一个。因此，上面的选择器会匹配任何元素class="minor"。

变通方法包括将多个类复制为单个类：

.major-minor { ... }
<span class="major minor major-minor">...</span>

或者，如果备用元素可用于清理，则包含：

.major .minor { ... }
<span class="major"><span class="minor">...</span></span>