：not（）没有按预期工作

Question

使用:not()运算符是否有任何限制？

我有这个HTML：

<table>
    <thead>
        <th>AAAAAAA</th>
        <th>VVVVVVVVVVV</th>
    </thead>
    <tr>
        <td>111111</td>
        <td>22222</td>
    </tr>
</table>
<br>
<br>
<br>
<br>
<table class="t">
    <thead>
        <th>AAAAAAA</th>
        <th>VVVVVVVVVVV</th>
    </thead>
    <tr>
        <td>111111</td>
        <td>22222</td>
    </tr>
</table>

这个CSS：

table td:not(.t) {
            border: 1px solid black;
            padding-left: 5px;
          }


table th:not(.t) {
            border: 1px solid black;
            padding-left: 5px;
          }

然而，两个表都获得了CSS规则。 Jsfiddle

Answer 1

这是因为.t适用于table而不是td

试试这个：

table:not(.t) td
{
    ...
}

---

table:not(.t) td, table:not(.t) th
{
    border: 1px solid black;
    padding-left: 5px;
}

注意，您也可以对声明进行分组，因为它们是相同的。

Answer 2

你有一个表的类，而不是任何其他元素。因此，不应将其应用于td将其应用于table，而是可以使用。