CSS特殊性规则

我正在使用twitter引导（TB），看起来他们的CSS规则在不应该的情况下优先。我制作了这把小提琴来说明问题：

HTML

根据我对特殊性规则的理解，在TB中为标签定义的规则应该只得到值1，因为html选择器得到值1。我的类的值应该是23，因为我有3个html选择器和2个类选择器，每个选择器的值应该是10。正如您在小提琴中看到的，TB css定义中的标签选择器优先

有人能解释一下我遗漏了什么吗

---

顺便说一句，我知道我可以用这个！重要标签要解决这个问题，我只是想更好地理解CSS的特殊性规则。

我不太清楚您认为的问题是什么，但我猜一下：

CSS特殊性决定了当给定元素的一个CSS属性有两个或多个规则时会发生什么

因此，考虑到以下HTML：

<label class="myLabel">Hello!</label>

标签将是蓝色的，因为

.myLabel

是比

标签

更具体的选择器

---

但是，标签的字体大小也将为24像素，因为

.myLabel

块不包括设置

font size

属性的规则。

特殊性规则仅在不同规则针对**相同元素（与标签颜色一样）时适用，而不是针对不同元素时适用（即使该元素的某些样式将被继承）

有一个样式规则应用于标签，即正确应用的颜色。所有其他样式都应用于另一个元素，因此直接针对标签的TB样式当然是首选

某些样式是继承的（例如示例中的字体大小和行距），但一旦有直接针对元素的规则，它们就会被覆盖。TB将使用以下规则覆盖字体大小和行距：

label, input, button, select, textarea {
  font-size: 14px;
  font-weight: normal;
  line-height: 20px;
}

您可以通过声明以下内容轻松解决此问题：

div.teaser h1.teaserText label {
     color: #FCCE00;
     font-size:inherit;
     line-height:inherit;
     /* and so on */
}​

---

我很困惑。显然，第二种样式更为具体，因为它是完全相同的样式，并附加了一个“标签”最后？首先，我需要知道您的期望。我在小提琴中看到的是，文本为黑色，大小为100px。标签和活动为正常字体大小和黄色。即，它拾取字体系列、文本转换和颜色。“我知道我可以使用

！important

标记来解决此问题”-不是在我的代码中，你不能。另外，

！important

不是一个标签，我认为它在这里不会有任何区别。我本来希望黄色小标签也能选择相同的字体大小、高度等…Christoph解释了我误解规则的原因和原因。谢谢大家。“只有当不同的规则针对相同的元素时，特殊性规则才适用”。

label {
    color: red;
    font-size: 24px;
}

.myLabel {
    color: blue;
}

label, input, button, select, textarea {
  font-size: 14px;
  font-weight: normal;
  line-height: 20px;
}

div.teaser h1.teaserText label {
     color: #FCCE00;
     font-size:inherit;
     line-height:inherit;
     /* and so on */
}​