html - 最初の行のセルにスタイルを適用する

Question

それは非常に単純なはずですが、私には理解できません。

私はこのようなテーブルを持っています:

<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>

1行目tdのタグにを持たせたい。しかし、2行目ではありません。trvertical-align

.category_table td{
    vertical-align:top;
}

score 188 · Accepted Answer

を使用tr:first-childして最初のtr:

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

ネストされたテーブルがあり、内側の行にスタイルを適用したくない場合は、いくつかの子セレクターを追加tdして、最初のトップレベルのトップレベルのみtrがスタイルを取得するようにします。

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

score 3 · Accepted Answer

これは仕事をするはずです：

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

score -1 · Accepted Answer

以下は、下の最初trのテーブルで機能しますthead

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

そして、これは最初と両方trで機能します：theadtbody

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

3 に答える 3