web-dev-qa-db-fra.com

Appliquer le style aux cellules de la première ligne

Cela devrait être très simple mais je ne peux pas le comprendre.

J'ai une table comme celle-ci:

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

Je veux que les balises td de la première rangée tr aient vertical-align. Mais pas la deuxième rangée.

.category_table td{
    vertical-align:top;
}
64
xperator

Utilisez tr:first-child pour prendre la première tr:

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

Si vous avez des tables imbriquées et que vous ne souhaitez pas appliquer de styles aux lignes intérieures, ajoutez des sélecteurs enfants afin que seuls les td de niveau supérieur de la première tr de niveau supérieur reçoivent les styles:

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

Cela devrait faire le travail:

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

Ci-dessous fonctionne pour la première tr du tableau sous thead 

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

Et cela fonctionne pour la première tr de thead et tbody les deux:

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