CSS如何使用伪类：不使用：nth-​​child

Question

是否可以将:not()与nth-child一起使用？

我没有运气就试过这样的事情：

td:not(:nth-child(4n)){
  text-align:center;
}

然而，这似乎有效：

td:not(:first-child){
  text-align:center;
}

我正在尝试的是对齐除第2和第4列以外的所有表格列。动态生成列以向这些列添加自定义类。

Answer 1

:not(:nth-child(4n))会为你提供任何不是:nth-child(4n)的东西，即任何不是第4，第8等的东西。它不会排除第二个孩子，因为2不是4的倍数。

要排除第二个和第四个，您需要以下任何一个：

如果您的列少于6列，则

• td:not(:nth-child(2n))或

• td:not(:nth-child(2)):not(:nth-child(4))如果您至少有6列，并且只想排除第2和第4列，而不是每个偶数列。

Demo

Answer 2

CSS中的默认方法不是使用“ not”，而是覆盖样式：

td {
    text-align: center;
}
td:first-child {
    text-align: left;
}