4) Tablas

Ejemplos (izquierda) y vista gráfica (derecha) con colores relacionados por etiqueta.

Leyenda de colores (etiqueta → color)

table caption thead tbody tfoot tr th td

Ejemplo completo (todas las etiquetas)

<table>
  <caption>Inventario</caption>

  <thead>
    <tr>
      <th scope="col">Producto</th>
      <th scope="col">Stock</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>Cuaderno</td>
      <td>12</td>
    </tr>
    <tr>
      <td>Lápiz</td>
      <td>40</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <td colspan="2">Total productos: 2</td>
    </tr>
  </tfoot>
</table>

Jerarquía lógica

table
├─ caption (opcional)
├─ thead (opcional) → tr → th
├─ tbody (opcional) → tr → td
└─ tfoot (opcional) → tr → td

Vista gráfica (misma paleta)

Cada etiqueta se destaca con el mismo color que en la leyenda.

table

caption: Inventario

th: Producto	th: Stock
td: Cuaderno	td: 12
td: Lápiz	td: 40
td (colspan="2"): Total productos: 2

Nota: Los colores solo son para identificar la etiqueta (en producción se estiliza con CSS).