19. Tablas de datos

<table> </table>

Etiqueta de tabla.

<tr> </tr>

Etiqueta una fila dentro de una tabla.

<thead> </thead>

Etiqueta la cabecera de una tabla. Está en la primera fila de una tabla.

<th> </th>

Etiqueta cada uno de los elementos de una cabecera de tabla.

<tbody> </tbody>

Cuerpo de una tabla, donde se encuentran los contenidos de la tabla. Permite separar la cabecera de los contenidos.

<td> </td>

Etiqueta un elemento de una tabla. Debe estar dentro de una fila.

<!-- comentario -->

Etiqueta para incluir un comentario dentro del código HTML. Los comentarios sirven para explicar el código HTML pero no se visualizarán en la página web.

Código de una tabla simple

../_images/html-table1-html.png

Plantilla de tabla de datos.

<table>
   <thead>
      <tr> <th>Columna 1</th> <th>Columna 2</th> </tr>
   </thead>

   <tbody>
      <tr> <td>Uno</td> <td> I </td> </tr>
      <tr> <td>Dos</td> <td> II </td> </tr>
      <tr> <td>Tres</td> <td> III </td> </tr>
   </tbody>
</table>

Resultado

../_images/html-table1-web.png

Código de una tabla con encabezado

../_images/html-table2-html.png

Plantilla de tabla de datos.

<table>
   <thead>
      <tr> <th>Columna 1</th> <th>Columna 2</th> </tr>
   </thead>

   <tbody>
      <tr> <td>Uno</td> <td> I </td> </tr>
      <tr> <td>Dos</td> <td> II </td> </tr>
      <tr> <td>Tres</td> <td> III </td> </tr>
   </tbody>
</table>

Resultado

../_images/html-table2-web.png