为什么CSS：不是伪类不能按预期工作？

Question

考虑以下HTML：

<div class="a">
    <div class="b">Hello</div>
  </div>
  <div class="c">
    <div class="b">World</div>
</div>

仅添加以下CSS颜色＆＃34; World＆＃34;红色，正如所料：

.c .b {
  color: red;
}

但是，添加以下CSS代替colors both "Hello" and "World" in red：

:not(.a) .b {
  color: red;
}

为什么？

Answer 1

你需要这样说： -

Demo

div:not(.a) .b {
  color: red;
}

Pseudo-class :not

  

语法是selector：not（）{properties}

Answer 2

由于:not伪类表示一个未被其参数表示的元素， 您 指定要排除的元素 :not选择器

根据您的示例，请尝试以下方法：

div:not(.a) .b {
  color: red;
}