第一个TD的CSS选择器，除非包含colspan

Question

假设我有下表：

<table style="width:500px">
 <tr>
    <td>Col 1</td>
    <td>Col 2</td>
 </tr>
 <tr>
    <td colspan="2"></td>
 </tr>
</table>

现在如果我使用first-child选择器将样式应用到第一个TD，无论如何我可以让它忽略具有colspan的td（即使当然这是第一个孩子）？

table tr td:first-child{
  width:100px;
}

我很乐意为td提供colspan它自己的类名，如果有一种方法可以修改我的选择器来说apply to first child except when the class name is x？

Answer 1

使用:not([attr="val"])

table tr td:first-child:not([colspan="#NUMBER OF COLSPAN"]){

    width:100px;

}

Answer 2

试试这个：

table tr td:first-child:not(.ignore) {
  width:100px;
}

（你给td你要忽略一类“忽略”）

Answer 3

为什么不给这个阶级一个对立的财产？

table tr td:first-child{
    width:100px;
}

.your_class {
    width:auto !important;
}

Answer 4

一种简单的方法是只将一个类添加到您真正想要选择的第一个TD：

<table style="width:500px">
 <tr>
    <td class='selectable'>Col 1</td>
    <td>Col 2</td>
 </tr>
 <tr>
    <td colspan="2"></td>
 </tr>
</table>

然后点击：

table tr td.selectable {
    width: 100px;
}

或者，您可以尝试jQuery并在您不希望受影响的行上放置“ignoreMe”的类名：

$('table tr td:first-child').not('.ignoreMe').css({width:100});