Question

我正在尝试将样式应用于除.reset-this之外的所有元素以及作为.reset-this的后代的元素。我的CSS无效。它不适用于任何元素。

*:not(.reset-this, .reset-this *) { //styles in here }

要查看它无法正常工作的实例，请转到此小提琴：http://jsfiddle.net/sh39L882/1/

Answer 1

在CSS 3中，更具体地说是Selectors Level 3：

否定伪类，不是（X），是一个函数符号，它将一个简单的选择器（不包括否定伪类本身）作为一个参数。

这里的关键是simple selector。 :not仅访问.classsName等简单选择器，而不是,或.className .child。

但请注意，这已在Selectors Level 4中更新：

否定伪类：not（），是一个以选择器列表作为参数的函数伪类。

请注意simple selector更改为selector list。这意味着您尝试做的事情是可能的，但仅限于实施新规范的浏览器。

您可以随时广泛应用这些样式，然后将其还原：

* {
  color: red
}

.reset-this, .reset-this * {
  color: black;
}

但这非常糟糕，粗暴丑陋。正如您所评论的那样，设计类结构以避免这种情况会好得多。

Answer 2

不幸的是，你必须对你的风格更加具体。

首先，通配符（*）选择器不能与伪类一起使用，因为它太宽泛 - 它本质上否定了:not。相反，您可以使用body :not。

此外，伪类不能被继承。最好的选择是让你的后代继承其父母的风格。

Answer 3

试试这个：

*:not(.reset-this), .reset-this * {
    color:red;
}