我想基于祖先中不存在的另一个类来设计一个类的样式。
div:not(.evil-class) .element {
background-color: green;
}<div class="evil-class">
<div class="element">An element within the evil class</div>
</div>
<div class="element">An element NOT in the evil class</div>不知道为什么不起作用？
我知道我可以做相反的事对两个元素应用一个样式，然后覆盖那个样式，但我不想这样做，因为我会覆盖样式，它可能在第三方库中更改。
谢谢。
1条答案
按热度按时间4uqofj5v1#
div:not(.evil-class) .element表示"具有类 * element * 的东西，该是从没有类 * evil-class * 的 * div * 继承而来的"您的元素不是 * any * div的后代，因此
div:not(.evil-class)不匹配任何祖先（在本例中只有<body>和<html>）。目前在CSS中还没有办法表达"没有一个祖先具有特定的类"。
选择器Level 4建议允许
:not()包含复杂的选择器，以便将来您可以执行以下操作：浏览器支持目前几乎不存在，但上面的演示在当前版本的Safari中有效。