Appliquer un style aux cellules de la première ligne

Question

Cela devrait être très simple mais je n'arrive pas à le comprendre.

J'ai un tableau comme celui-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 faire td balises du premier tr rangée ont vertical-align . Mais pas la deuxième rangée.

.category_table td{
    vertical-align:top;
}

Answer 1

Utilice tr:first-child pour prendre le premier tr :

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

Si vous avez des tableaux imbriqués et que vous ne souhaitez pas appliquer de styles aux lignes intérieures, ajoutez des sélecteurs enfants de manière à ce que seul le tableau de niveau supérieur soit utilisé. td dans le premier niveau supérieur tr obtenir les styles :

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

Answer 2

Cela devrait faire le travail :

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

Answer 3

Le tableau ci-dessous fonctionne pour la première fois tr de la table sous thead

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

Et cela fonctionne pour le premier tr de thead y tbody les deux :

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