在 CSS 中组合 :not() 选择器

Question

我试图选择 table 中的所有 tr 元素，除了第三个和第四个元素。我设法通过使用以下方法来做到这一点：

#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() 方法） 。

但是，您的第二种语法是建议的 对 :not() 的增强 在选择器 4 中，其工作方式与您的第一个相同。尽管该示例（无论如何在撰写本文时显示）显示了 :not() 选择器链，但该提案表示：

否定伪类 :not(X) 是一种以选择器列表作为参数的函数符号。它表示一个未由其参数表示的元素。

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

如果您需要否定包含组合符（>、+、~、空格等的选择器，例如 div p< /code>)，不能在 CSS 中使用 :not()；你必须使用 jQuery 解决方案。

Answer 2

虽然标记的答案是正确的，但我只是想指出，您也可以使用 css 实现您想要的效果，但只是以不同的方式。您可以选择这些并取消应用您不需要的内容，而不是使用 not。

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