嵌套在css：not（）选择器内 [英] nesting inside css :not() selectors

问题描述

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

Is it possible to have nested values inside the :not selector? For eg:

:not(div > div)

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

Whenever I tried it, it does not seem to work. Perhaps you need to use it another way which I have not figured out? So far, in all the examples I see, you can only use one value inside this selector.

推荐答案

code>：not（）一次只接受一个简单的选择器;这在选择器3规范中提及：

:not() only accepts one simple selector at a time; this is mentioned in the Selectors 3 spec:

否定伪类：not（X）是一个函数符号，取简单选择器（不包括否定伪类本身）作为参数。它表示不是由其参数表示的元素。

The negation pseudo-class, :not(X), is a functional notation taking a simple selector (excluding the negation pseudo-class itself) as an argument. It represents an element that is not represented by its argument.

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

The simple selectors in your example would be the two div tokens that you have. Other simple selectors include class selectors, ID selectors, attribute selectors and pseudo-classes. It does not accept more than one simple selector, nor does it accept combinators like > or space.

你试图选择的元素，可能没有办法排除 div> div ：

Depending on which elements you're trying to select exactly, there may not be a way to exclude div > div:

• 如果您只想选择 div ，它们本身不是 div ，请改用：

• If you only want to select elements that are children of a div, that are themselves not div, use this instead:

div > :not(div)

如果只想选择 div 的父元素不是 div 的元素，请改用：

If you only want to select div elements whose parent element is not a div, use this instead:

:not(div) > div

如果要使用此否定

在CSS中唯一可行的解​​决方法是，我使用一个选择器来选择 可以想到的是在没有：not（）表达式的情况下将样式应用到所需的元素，然后为 div> div 。这适用于您尝试定位的任何元素集;

The only other viable workaround in CSS that I can think of is to apply styles to the elements you want without the :not() expression, then undo them for div > div. This works for any set of elements you're trying to target; the disadvantage is that not all properties can be easily reset.

或者，如果您使用jQuery，它支持：not（div> ; div） 不像CSS版本，你可以将选择器放在一个脚本中，例如，jQuery应用一个类名称到这些元素，然后在CSS中定位该类。

Alternatively, if you're using jQuery, which does support :not(div > div) unlike the CSS version, you can place the selector in a script and, for instance, have jQuery apply a class name to those elements then target that class in your CSS.

这篇关于嵌套在css：not（）选择器内的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！