组合：CSS中的not（）选择器 [英] Combining :not() selectors in CSS

问题描述

我尝试选择表中的所有 tr 元素，但第三和第四个除外。我设法使用：

  #table tr：not（：nth-​​child（3））：not nth-child（4））
  

我想合并这些选择器， ：nth-​​child 条目。这样的东西，但它不工作：

  #table tr：not（：nth-​​child nth-child（4））
  

不是在CSS。我使用的是Chrome（我只需要在那里工作）。

我找不到这种情况下的组合选择器。如何将选择器与：

解决方案

在<$内不允许使用任何单个简单选择器 c $ c>：not（）伪类。作为一个jQuery选择器，它的工作原理是因为jQuery扩展其：not（）功能，允许任何选择器（如。不过，您的第二个语法是建议的 。在选择器4中的：not（）的.org / csswg / selectors4 /＃negationrel =noreferrer>增强功能，虽然示例（显示为本文写作）显示一个：not（）选择器链，建议说：

否定伪类，：not（X），是一个以选择器列表作为参数的函数符号。它表示一个不是由其参数表示的元素。

这里的选择器列表只是逗号分隔的选择器列表。

如果需要取消包含组合器的选择器（> ， + ，〜 ，空格等，例如 div p ），则不能使用：not（） in CSS;你必须使用jQuery解决方案。

I'm trying to select all tr elements inside a table, except the third and fourth. I managed to do so by using:

#table tr:not(:nth-child(3)):not(:nth-child(4))

I'd like to combine those selectors because I've some more :nth-child entries. Something like this, but it didn't work:

#table tr:not(:nth-child(3), :nth-child(4))

This does work in jQuery, but not in CSS. I'm using Chrome (and I only need it to work there).

I've not been able to find a combining selector for this case. How can I combine selectors with :not?

解决方案

Selectors level 3 does not allow anything more than a single simple selector within a :not() pseudo-class. As a jQuery selector, it works because jQuery extends its :not() functionality to allow any selector (like the .not() method).

However, your second syntax is one of the proposed enhancements to :not() in Selectors 4, and works equivalently to your first. Although the example (shown as of this writing anyway) shows a chain of :not() selectors, the proposal says:

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

Here a selector list is simply a comma-separated list of selectors.

If you need to negate selectors that contain combinators (>, +, ~, space, etc, for example div p), you can't use :not() in CSS; you'll have to go with the jQuery solution.

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