CSS重要性顺序

Question

我正在尝试使用Twitter Bootstrap将表中一列的内容对齐。

问题是，.text-right类不适用于<td>元素。应用text-align:right样式有效，但我很好奇为什么应用于元素的类的优先级低于一般元素样式。

http://jsfiddle.net/ctANw/6/

Answer 1

I'm curious why class applied to element has lower priority then general element style.

因为内联样式在CSS中具有最大的特异性（除了使用!important关键字）

将特异性视为四个数字（0,0,0,0）

• 内联样式是第一个 - 最高优先级
• ID选择器是第二个数字
• 伪类，属性选择器和类是第三个
• 类型选择器是第四个（这也包括伪元素）
• 通用选择器*的特异性为0，任何东西都会覆盖它。

使用它你应该能够弄清楚如何覆盖特定的选择器

Answer 2

只是第192行的.table td规则有“text-align：left;”正在覆盖它。

Answer 3

这是Specificity hierarchy的问题。

每个选择器都在特异性层次结构中占有一席之地。有四个不同的类别定义了给定选择器的特异性级别：

1. 内联样式（文档中样式的存在）。内联风格生活 在您的XHTML文档中。它直接附加到元素上 被称为风格。例如。 <h1 style="color: #fff;">

2. ID（ID选择器的数量）ID是页面元素的标识符， 例如#div。

3. 类，属性和伪类（类选择器的数量）。这个 group包括.classes，[attributes]和伪类等 :hover，:focus等。

4. 元素和伪元素（元素（类型）选择器的数量）。 包括例如:before和:after。