Styl CSS dla pierwszego <td> w <tr>

Question

Próbuję ustawić wszystkie elementy < tr> na wyrównane do prawej z wyjątkiem pierwszego, które chcę wyrównane do lewej. Próbowałem tego:

<style> 
td { text-align: right }; 
td:first-child { text-align: left }; 
</style> 

To powoduje, że wszystkie komórki są wyrównane do prawej. Jeśli zamieniam kolejność tych dwóch wierszy, wszystkie komórki zostaną wyrównane do lewej. Bardzo zdezorientowany. Według w3schools,

Selektor: pierwszy-dziecko służy do wyboru określonego selektora, tylko jeśli jest pierwszym dzieckiem jego rodzica.

Ale wydaje się, że to nie dzieje się dla mnie.

Answer 1

Twoja składnia była niepoprawna.

td { text-align: right };     /* This was being applied */ 
td:first-child { text-align: left };   /* This wasn't.. */ 

Powinno być:

td { text-align: right; } 
td:first-child { text-align: left; } 

zanotować średniki - nie powinny być poza nawiasami {}

Inne niż, że uzywasz :first-child prawidłowo.

jsFiddle demo

Answer 2

Inną opcją, w zależności od tego, co chcesz zrobić:

table tr td { 
    background-color:red;} 
table tr td:nth-child(1) { 
    background-color:green;} 

Answer 3

td:nth-child(2) { text-align: right; } 

można to zrobić w jednej linii.