En este ejemplo vamos a ver como podemos dar color a una tabla HTML. Lo que haremos es que la tabla tenga un color homogéneo en toda la tabla.
Lo primero será crear una tabla con los elementos HTML table, tr y td.
<table>
<tbody>
<tr>
<th>País</th>
<th>Capital</th>
<th>Superficie</th>
<th>Habitantes</th>
</tr>
<tr>
<td>España</td>
<td>Madrid</td>
<td>504.645 km<sup>2</sup></td>
<td>46,6 M</td>
</tr>
</tbody>
</table>
Esta será la tabla sobre la que demos el color. Para dar color a una tabla HTML vamos a apoyarnos en CSS. En concreto vamos a dar estilo a lo que sería el elemento table. Es decir, al mismo elemento que representa toda la tabla.
table { ... }
El atributo que nos permite dar color a una tabla es background-color. Al atributo background-color podemos indicarle el color mediante un nombre en inglés que represente el color:
table {
background-color: red;
}
O bien podemos utilizar el color en hexadecimal. En este caso deberemos de utilizar una almohadilla delante del color hexadecimal.
table {
background-color: #f00;
}
De esta forma tan sencilla habremos conseguido poner un color a una tabla con HTML y CSS.
