css :not() 选择器不能与通用选择器一起使用 (*) [重复] 。

Question

海伊

看起来像css选择器 :not() 不太适合与 * 选择器。

有什么办法吗，还是我做错了什么？

*:not(.nope){
  color: green;
}

<div>hai</div>
<div>I</div>
<div class="nope">am</div>
<div>Jhon</div>

我仍然得到 'am' 为绿色。

先谢谢你了

Answer 1

万能选择器(*)不是问题所在。是对 color 财产。 - 当你说...

当你说...

*:note(.nope)

这很好，但你忘了，... * 将颜色应用于 body 和 html 元素，也是。

所以 .nope 从它的父代获得绿色。

如果你使用了一个不被继承的属性（如 border)你就不会有这个问题。

*:not(.nope){
  border: 1px solid red;
}

* {
  margin: 5px;
}

<div>hai</div>
<div>I</div>
<div class="nope">am</div>
<div>Jhon</div>

请注意 .nope 并没有得到边框。

要想颜色能如你所愿，就要具体一点。

div:not(.nope) {
  color: green;
}

<div>hai</div>
<div>I</div>
<div class="nope">am</div>
<div>Jhon</div>