css相同特殊性

阿涛思密达
  • 109
p.intro{
    color: red;
}

div div div div div div div div div div p{
    color: blue;
}

<div><div><div><div><div><div><div><div><div><div>
<p class="intro">second</p>
</div></div></div></div></div></div></div></div></div></div>

为什么后面的没有覆盖前面的?

评论
阅读 1k
3 个回答

你可能把特殊性的计算方式搞错了

第一个选择器的特殊性是 0, 0, 1, 1
第二个选择器的特殊性是 0, 0, 0, 11 不能进位!

第一个选择器的特殊性大于第二个,所以 div div div div div div div div div div p 是覆盖不了 p.intro

!important > ID >类>属性 >标签>*

从css选择器的优先级上来看。

优先级的问题
在后面加上!important试一试

宣传栏