html - 最后一个p属性是否应该覆盖其上方的所有p属性？

<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>

最佳答案

不，因为第一条规则比其他规则的specificity高。
“最后一个赢”规则仅适用于具有相同特定性的CSS规则。