MODULO 4 - Lección 5 - HTML: TABLAS
Una tabla HTML es una forma gráfica de representar información de manera esquematizada, ordenada y compacta.
Las tablas se organizan en filas y celdas.
Las tres etiquetas principales para las tablas son:
La etiqueta <table></ table> indica el inicio y el cierre de la tabla y el resto de etiquetas estarán recogidas entre ellas.
Fila: Table Row <tr></tr>
Celda de datos: Table Data Cell <td></td>
Otras etiquetas para las tablas son:
Celda de Cabecera: Table Header Cell <th> sustituye a la etiqueta <td> para celdas de cabecera.
Es posible agrupar filas en 3 bloques de estilos:
<thead> agrupa una o más filas de cabecera
<tbody> se utiliza para agrupar filas de cuerpo, tipicamente aquellas que contienen el grueso de los datos.
<tfoot> Agrupa las filas del pie de la tabla.
<caption> añade un título sobre la tabla
Los estilos se trabajarán en CSS
Para combinar celdas, utilizaremos los atributos de las celdas: colspan y rowspan, esperan un valor entero que especifique cuantas columnas o filas ocupa la celda.
<td colspan="x">...</td> : la celda ocupa X columnas.
<td rowpan="x">...</td> : la celda ocupa X filas.
Para que una celda pueda ocupar el espacio de otras, es necesario que ese espacio no se rellene.
Para dar estilos por columnas, podemos hacer uso de las etiquetas <colgroup>...</colgroup> y <col/>
La etiqueta <col/> no tiene no tiene etiqueta de cierre, pero conviene cerrarla adecuadamente para cumplir con el starndard.
El atributo span, funciona de forma parecida en <colgroup> y <col/> a como lo hacian colspan y rowspan para las celdas de la tabla.
El valor del atributo, indica el número de columnas que agrupará <colgroup> o <col/>
CONSEJOS:
- Tablas HTML para representar tablas
- Cuidado con la combinación de celdas
- Utilizar la agrupación de filas y columnas para que el posterior trabajo de estilo con CSS resulte más sencillo.
RECURSOS:
Comentarios
Publicar un comentario