Tabla de contenidos
Las tablas de contenido nos permiten almacenar los datos de forma ordenada.
El principio y final de una tabla se define con las etiquetas <table>
y </table>
. Las filas se engloban con las etiquetas <tr>
</tr>
y las columnas estarán dentro de la etiquetas <td>
</td>
.
La etiqueta <table>
puede incluir diferentes opciones, como puedes ver en la siguiente tabla.
Elemento | Descripción |
---|---|
<table> |
Representa datos con más de una dimensión. |
<caption> |
Representa el título de una tabla. |
<tr> |
Representa una fila de celdas en una tabla. |
<td> |
Representa una celda de datos en una tabla. |
<th> |
Representa una celda encabezado en una tabla. |
<colgroup> |
Representa un conjunto de una o más columnas de una tabla. |
<col> |
Representa una columna de una tabla. |
0
Para dar estilos a los elementos utilizaremos siempre CSS y no atributos HTML. No obstante, se van a mencionar estos atributos porque todavía se encuentran presentes en multitud de proyectos online.
Verás que en muchos códigos se le añade un borde a la tabla usando el atributo border. Sin embargo, este atributo ya no es aceptado en HTML5. A pesar de ello, los navegadores reconocen este atributo por estar definido en versiones antiguas de HTML.
<table border="2">
Para modificar la posición de la tabla también se utilizaba el atributo align.
<table align="center">
También podemos asignar fondos a las celdas y filas de una tabla con el atributo bgcolor.
<td bgcolor="#77DDEE">
Recuerda que será mediante CSS la técnica que usaremos para dar estilos a nuestras tablas.
Para agrupar celdas en una sola, también llamado «combinación de celdas», utilizaremos los atributos “rowspan” (para agrupar verticalmente) y “colspan” (para agrupar horizontalmente).
dark
td
sólo puede estar presente como hija de un elemento tr
.