本质上，我希望所有“ a”元素都为红色，除非它们是属性为“ data-foo”的元素的子代。
此html：
<div data-foo="whatever">
<div>
... more descendants
<a href="#">I should be default color</a>
</div>
</div>
<a href="#">I should be red</a>
使用此CSS：
:not([data-foo]) a {
color: red;
}
在此示例中，仍选择两个“ a”元素。我还尝试了以下方法：
div:not([data-foo]) a
*:not([data-foo]) a
div:not([data-foo]) a
*:not(div[data-foo]) a
但是我要么什么都没有选择，要么全部都选择了。这是一个可能的选择吗？
简单-首先设置一个更通用的规则（所有锚点都是红色的），然后进行特定的例外处理（具有“ data-foo”属性的祖先的例外）：
a { color:red; }
[data-foo] a { color:inherit; }
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句