css - 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 规则具有“文本对齐：左；” 正在覆盖它。

Answer 3

这是Specificity 层次结构的问题。

每个选择器在特异性层次结构中都有自己的位置。有四个不同的类别定义了给定选择器的特异性级别：

1. 内联样式（文档中存在样式）。内联样式存在于您的 XHTML 文档中。它直接附加到要设置样式的元素上。例如<h1 style="color: #fff;">

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

3. 类、属性和伪类（# of class 选择器）。该组包括 .classes、[attributes] 和伪类，例如 :hover等:focus。

4. 元素和伪元素（# of Element（类型）选择器）。包括例如:before和:after。