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

【问题标题】：Is there a way to query for element with multiple classes in CSS?有没有办法在 CSS 中查询具有多个类的元素？
【发布时间】：2009-08-07 20:29:41
【问题描述】：

如何查询同时具有两个类的元素？

例如：

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

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

【问题讨论】：

【解决方案1】：

以下应该可以解决问题：

span.major.minor { color: red; }

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

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

【讨论】：

【解决方案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>

【讨论】：