应用样式第一行的细胞(Apply style to cells of first row)

它应该是很简单的，但我不能弄明白。

我有这样一个表：

<table class="category_table">
 <tr><td> blabla 1</td><td> blabla 2 </td></tr>
 <tr><td> blabla 3 </td><td> blabla 4 </td></tr>
</table>

我要让td第一标签tr排有vertical-align 。 但不是第二行。

.category_table td{
    vertical-align:top;
}

Answer 1:

使用tr:first-child采取的第一个tr ：

.category_table tr:first-child td {
    vertical-align: top;
}

如果您有嵌套表，你不想样式应用到内部各行中，添加一些子选择器所以只有顶级td在第一顶级别s tr得到的样式：

.category_table > tbody > tr:first-child > td {
    vertical-align: top;
}

Answer 2:

这应该做的工作：

.category_table tr:first-child td {
    vertical-align: top;
}

Answer 3:

以下适用于第一tr下表的thead

table thead tr:first-child {
   background: #f2f2f2;
}

这适用于第一tr的thead和tbody两个：

table thead tbody tr:first-child {
   background: #f2f2f2;
}

文章来源: Apply style to cells of first row