Location: Inicio > Tutoriales HTML > Tablas en HTML > Tablas en HTML (página 3)

Tablas en HTML (página 3)

Tabla de contenidos

Páginas:<1 234 5 >

Agrupación horizontal

Una tabla HTML puede ser organizada horizontalmente en tres grupos: el encabezado (elemento HTML thead), el cuerpo o cuerpos (elemento HTML tbody) y el pie (elemento HTML tfoot). Cada uno de estos elementos encierra un grupo de filas. Estas divisiones pueden ayudar a hacer las tablas más fáciles de leer, especialmente cuando la tabla se debe mostrar en más de una página (por ejemplo, cuando una tabla grande debe ser impresa). Es estos casos, el encabezado y el pie son mostrados en cada página para mejorar la comprensión.

Código

<table>
<thead>
<tr>
<th scope="col">Mes</th>
<th scope="col">Vitamina A</th>
<th scope="col">Vitamina B</th>
<th scope="col">Vitamina C</th>
</tr>
</thead>
<tfoot>
<tr>
<td scope="row">Todo</td>
<td>32.8</td>
<td>104.2</td>
<td>21.0</td>
</tr>
</tfoot>
<tbody>
<tr>
<td scope="row">Enero</td>
<td>12.8</td>
<td>42.6</td>
<td>5.2</td>
</tr>
<tr>
<td scope="row">Febrero</td>
<td>10.5</td>
<td>30.1</td>
<td>10.4</td>
</tr>
<tr>
<td scope="row">Marzo</td>
<td>9.5</td>
<td>31.5</td>
<td>5.4</td>
</tr>
</tbody>
</table>

Vista

Mes	Vitamina A	Vitamina B	Vitamina C
Todo	32.8	104.2	21.0
Enero	12.8	42.6	5.2
Febrero	10.5	30.1	10.4
Marzo	9.5	31.5	5.4

Nota que el pie es ubicado en el código, preferentemente justo debajo del encabezado al comienzo de la tabla. Esto se debe a que en tablas muy largas, que pueden tomar algún tiempo en descargarse completamente (hasta minutos), los navegadores pueden decidir mostrar el pie aún antes de que todo el cuerpo hay sido recibido.

Una sola tabla puede tener más de un cuerpo. Esto permite a los autores dividir las filas en grupos. Por ejemplo, en la tabla de arriba (si abarcase todo el año) los meses podrían ser agrupados en cuatrimestres, generando así tres cuerpos.

Páginas:<1 234 5 >