css - 特异性错误 - CSS

Question

因此，在计算某些 CSS 代码的特异性时，我遇到了一些我认为矛盾的情况。

根据“公式”(inline > id > class > elements)我对前面的几行进行了计算:

(1)  p.b {color: red}          Specificity: (0,0,1,1)
(2)  .a>.c {color: black}                   (0,0,2,0)

由于 (2) 有 2 个类，其特异性高于 (1)，因此浏览器应该选择黑色而不是红色，而情况恰恰相反。

任何人都可以告诉我我做错了什么吗？

HTML 代码:

/* Specificity: (0,0,1,1) */
p.b {
  color: red
}

/*              (0,0,2,0) */
.a>.c {
  color: black
}

<div class="a">
  <div class="c">
    <p class="b">Parágrafo 2</p>
  </div>
</div>

Answer 1

关于第二段:在两个选择器中，.a > .c选择器仅直接应用于父级 <div class="c">元素。如果任何其他选择器不覆盖它的样式，则会继承它的样式。但是p.b选择器是两个中唯一一个直接应用于子<p>的选择器元素中包含文本，因此它优先。正如另一位发帖者所说，除非两个选择器针对同一元素，否则特异性规则不适用。在这里，他们的目标是 parent 和 child 。在决定子级的样式时，子级自己的选择器将始终胜过从父级继承的样式。