嵌套在css：not（）选择器中

Question

是否可以在：not selector中包含嵌套值？例如：

:not(div > div)

每当我尝试它时，它似乎都不起作用。 也许你需要以另一种我没想过的方式使用它？ 到目前为止，在我看到的所有示例中，您只能在此选择器中使用一个值。

Answer 1

:not()一次只接受一个简单的选择器;这在Selectors 3 spec：

中提到

  

否定伪类:not(X)是一个函数符号，它将simple selector（不包括否定伪类本身）作为参数。它表示一个未由其参数表示的元素。

示例中的简单选择器将是您拥有的两个div标记。其他简单的选择器包括类选择器，ID选择器，属性选择器和伪类。它不接受多个简单的选择器，也不接受像>或空格这样的组合器。

根据您尝试精确选择的元素，可能无法排除div > div：

• 如果您只想选择div的子元素，而这些元素本身不是div，请改用：

  div > :not(div)
  

• 如果您只想选择其父元素不是div的{​​{1}}元素，请改用：

  div

如果你想单独使用这个否定，选择所有其他元素，那么就没有办法只使用选择器了。

我能想到的CSS中唯一可行的解​​决方法是在没有:not(div) > div 表达式的情况下将样式应用于所需的元素，然后为:not()撤消它们。这适用于您尝试定位的任何元素集;缺点是并非所有属性都可以轻松重置。

或者，如果您正在使用支持div > div unlike the CSS version的jQuery，您可以将选择器放在脚本中，例如，让jQuery将类名应用于这些元素然后定位CSS中的那个类。