结合:CSS中的not()选择器

Question

我正在尝试选择a中的所有tr元素table,除了第三个和第四个.我设法通过使用:

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

我想结合这些选择器,因为我还有更多的:nth-child条目.像这样的东西,但它不起作用:

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

这确实在jQuery的工作,但不是在CSS.我正在使用Chrome(我只需要它在那里工作).

我无法为这种情况找到组合选择器.如何将选择器与:not？

Answer 1

选择器级别3不允许在伪类中使用单个简单选择器:not().作为一个jQuery选择器,它的工作原理是因为jQuery扩展了它的:not()功能以允许任何选择器(如.not()方法).

但是,您的第二种语法是Selectors 4中提议的增强功能:not()之一,并且与您的第一种语法等效.尽管这个例子(无论如何都显示在本文中)显示了一系列:not()选择器,但提案说:

否定伪类:not(X)是一个以选择器列表作为参数的功能表示法.它表示一个未由其参数表示的元素.

这里的选择器列表只是一个以逗号分隔的选择器列表.

如果您需要否定包含组合子(选择>,+,~,空间等,例如div p),您不能使用:not()在CSS; 你必须使用jQuery解决方案.

Answer 2

尽管标记的答案是正确的，但我只想指出，您也可以使用 css 实现您想要的功能，但只是方式不同。您可以选择那些并取消应用您不想要的东西，而不是使用 not。

#table tr {
    /* general case styling */
    color: blue;
}
#table tr:nth-child(3),
#table tr:nth-child(4) {
    color: black;
}