Question

我有一个包含2个类的范围，例如<span class="tag invalid_tag">abc</span>。我正确地通过jQuery添加第二个类，我需要第二个类的属性覆盖第一个，而不是实际删除它。例如，属性是字体颜色和背景颜色。通常标签是绿色的，但是当我添加类“invalid_tag”时，它应该变为红色，但它不会，因为第一个类具有优先级。我想知道如何改变这个优先级，或者如果我能以不同的方式实现这一点。

Answer 1

CSS声明的优先级依赖于它们在CSS中的顺序（后面的声明覆盖了之前的声明）及其特殊性（更具体的声明覆盖了不太具体的声明）。（它与您在属性中指定类名的顺序无关。）更多 Section 6 规范。

以下是订单的示例。这个CSS

.foo {
    color: red;
}
.bar {
    color: blue;
}

使用此HTML

<p class="foo bar">Hi there</p>
<p class="bar foo">Hi again</p>

...产生两个蓝色段落，因为第二个声明优先于第一个声明。（Live example）这是因为两个声明具有相同的特异性。

以下是特异性的证明：

这个CSS

p.foo {
    color: red;
}
.bar {
    color: blue;
}

...使用相同的HTML会产生两个红色段落，因为选择器p.foo比选择器.bar更具体，所以它优先于它，即使它是早在CSS中。（Live example）

css课程的优先级

1 个答案: