Tablas
Las tablas en HTML utilizan los mismos conceptos de filas, columnas, cabeceras y títulos que los que se utilizan en cualquier otro entorno de publicación de documentos:
Tablas básicas
Las tablas más sencillas de HTML se definen con tres etiquetas: <table> para crear la tabla, <tr> para crear cada fila y <td>para crear cada columna.
A continuación se muestra el código HTML de una tabla sencilla:
<html>
<head>
<title>Ejemplo de tabla sencilla</title>
</head>
<body>
<h1>Listado de cursos</h1>
<table> <tr> <td><strong>Curso</strong></td> <td><strong>Horas</strong></td> <td><strong>Horario</strong></td> </tr>
<tr> <td>CSS</td> <td>20</td> <td>16:00 - 20:00</td> </tr>
<tr> <td>HTML</td> <td>20</td> <td>16:00 - 20:00</td> </tr>
<tr> <td>Dreamweaver</td> <td>60</td> <td>16:00 - 20:00</td> </tr>
</table>
</body>
</html>
Las tablas más sencillas de HTML se definen con tres etiquetas: <table> para crear la tabla, <tr> para crear cada fila y <td>para crear cada columna.
A continuación se muestra el código HTML de una tabla sencilla:
<html>
<head>
<title>Ejemplo de tabla sencilla</title>
</head>
<body>
<h1>Listado de cursos</h1>
<table> <tr> <td><strong>Curso</strong></td> <td><strong>Horas</strong></td> <td><strong>Horario</strong></td> </tr>
<tr> <td>CSS</td> <td>20</td> <td>16:00 - 20:00</td> </tr>
<tr> <td>HTML</td> <td>20</td> <td>16:00 - 20:00</td> </tr>
<tr> <td>Dreamweaver</td> <td>60</td> <td>16:00 - 20:00</td> </tr>
</table>
</body>
</html>
La etiqueta <table> encierra todas las filas y columnas de la tabla. Las etiquetas <tr> (del inglés "table row") definen cada fila de la tabla y encierran todas las columnas.
Por último, la etiqueta <td> (del inglés "table data cell") define cada una de las columnas de las filas, aunque realmente HTML no define columnas sino celdas de datos.
Los atributos de la etiqueta <th> son idénticos que los atributos definidos para la etiqueta <td>. En este caso, el atributo más utilizado es scope, que permite indicar si la celda es cabecera de la fila o de la columna (<th scope="row">y<th scope="col">respectivamente).
Por otra parte, HTML define la etiqueta <caption> para establecer la leyenda o título de una tabla. La etiqueta debe colocarse inmediatamente después de la etiqueta <table> y cada tabla sólo puede incluir una etiqueta <caption>.
0 comentarios:
Publicar un comentario
Ingresa tu consulta