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;
}
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;
}
Cela devrait faire le travail:
.category_table tr:first-child td {
vertical-align: top;
}
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;
}