Ejemplo first-child – asignar un estilo a la primera columna de una tabla
Supongamos que tenemos la siguiente tabla:
1 2 3 4 5 6 | <table id="milistado"> <tr><th>1 cabecera</th><th>2a cabecera</th></tr> <tr><td>1/1 cotendio</td><td>1/2 cotendio</td></tr> <tr><td>2/1 cotendio</td><td>2/2 cotendio</td></tr> <tr><td>3/1 cotendio</td><td>3/2 cotendio</td></tr> </table> |
Y queremos asignar un estilo a la primera columna (1/1 contenido). Y solo a la primera columna.
El estilo que utilizaríamos es *:
1 2 | #milistado tr td:first-child { background: #F80; }
#milistado tr td:last-child { background: #F50; } |
Con lo que pondríamos de color naranja solamente la primera columna. He añadido también en el ejemplo el uso del seudoelemento CSS last-child, primo hermano de first-child, que lógicamente asigna el estilo al útlimo elemento (en el ejemplo a 3/2 contenido).
