Páginas

Etiqueta <table>

<table> se usa para crear tablas en HTML, es decir, una estructura con filas (rows) y columnas (columns) para mostrar datos de forma organizada (como una hoja de cálculo).

Estructura básica (sintaxis general)


<table>
  <tr>
    <th>Encabezado 1</th>
    <th>Encabezado 2</th>
  </tr>
  <tr>
    <td>Dato 1</td>
    <td>Dato 2</td>
  </tr>
  <tr>
    <td>Dato 3</td>
    <td>Dato 4</td>
  </tr>
</table>

Explicación de cada etiqueta


Etiqueta SignificadoFunción
<table>TablaEs la etiqueta principal que contiene todo
<tr>Table RowCrea una fila en la tabla
<th>Table HeaderCrea una celda de encabezado, el texto aparece en negrita y centrado
<td>Table DataCrea una celda de datos normal (contenido dentro de una fila)

Ejemplo práctico


<table border="1">
  <tr>
    <th>Nombre</th>
    <th>Edad</th>
    <th>Ciudad</th>
  </tr>
  <tr>
    <td>Juan</td>
    <td>22</td>
    <td>Bogotá</td>
  </tr>
  <tr>
    <td>Laura</td>
    <td>19</td>
    <td>Medellín</td>
  </tr>
</table>

resultado:


Nombre Edad Ciudad
Juan 22 Bogotá
Laura 19 Medellín

Atributos comunes

  • border: define el grosor del borde de la tabla.

    Ej: <table border="1">

  • cellpadding: define el espacio dentro de las celdas.

    Ej: <table cellpadding="10">

  • cellspacing: define el espacio entre las celdas.

    Ej: <table cellspacing="5">

  • width: ancho de la tabla (en píxeles o porcentaje).

    Ej: <table width="80%">
Labels: