css - Chrome CSS级联

Question

我有一个元素在我的 css 中为属性颜色设置了两次样式。更具体的选择器给出颜色:红色，另一种颜色:黑色。在实际显示的结果中显示黑色。

当我检查元素并查看计算样式时，我看到黑色的线被划掉了，红色没有被划掉。然而，即使相应的线被删除，结果颜色也显示为黑色。

当我使用 !important 时，它看起来仍然完全一样。有人知道为什么会这样吗？

Answer 1

CSS 是层叠样式表，因此它应用元素的最后代码。

 <p>TEST</p>
 p{color:red;!important}
 p{color:blue;}

因此 p 元素的颜色将为蓝色。这是 css 的正常行为。

但 CSS 对不同的选择器赋予优先级。

您的问题的实时原型(prototype):http://jsfiddle.net/2YMD3/2/

您可以在 here 上查看 css 优先级