最后一个p属性不应该覆盖它上面的所有p属性吗？

Question

<style>
#content p {color: yellow;}
p {color: purple;}
p {color: green;}
</style>

当我运行代码时，所有p变为黄色而不是绿色（这正是我所期望的。）

html代码：

<div id="content">
<p>Duis autem vel eum </p>
<p>Duis autem vel eum </p>
<p>Duis autem vel eum </p>
</div>

Answer 1

不，因为第一条规则比其他规则高specificity。

“最后一个获胜”规则仅适用于具有相同特异性的CSS规则。

Answer 2

一切都是正确的，因为css优先，你的p变黄了。阅读此article，它可以帮助您。