Tutorial:XHTML

Tablas: celdas (<td>), filas (<tr>) y celdas cabecera (<th>)

Mientras que <tr> es utilizado para definir filas, <td> se utilizará para definir cada una de las celdas y <th> para definir las celdas que son cabecera de una fila o columna. A continuación se presentan los atributos para cada una de éllas:

Celdas de tabla: <td>

Los atributos para las celdas son los siguientes:

1.- abbr = "texto" : Permite describir el contenido de la celda (se emplea sobretodo con los navegadores de voz utilizados por personas discapacitadas)

2.- scope = "col, row, colgroup, rowgroup" : Indica las celdas para las que esta celda será su cabecera.
Ej: scope="col" indicará que esa celda es la cabecera de todas las demás celdas que están en la misma columna.

3.- colspan = "número" : Número de columnas que ocupa esta celda.

4.- rowspan = "número" : Número de filas que ocupa esta celda.

Los atributos más utilizados son rowspan y colspan y se emplean para construir tablas complejas como las que se ven más adelante.

Celdas cabecera de tabla: <th>

Los atributos para las celdas cabecera de tabla son los mismos que para las celdas comunes (<td>). Sin embargo, el atributo más utilizado para <th> 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).

Supóngase la siguiente tabla:

El código resultante sería el siguiente:

<h1>Su pedido</h1>
<table>
  <tr>
    <th scope="col">Nombre producto</th>
    <th scope="col">Precio unitario</th>
    <th scope="col">Unidades</th>
    <th scope="col">Subtotal</th>
  </tr>
 
  <tr>
    <td>Reproductor MP3 (80 GB)</td>
    <td>192.02</td>
    <td>1</td>
    <td>192.02</td>
  </tr>
 
  <tr>
    <td>Fundas de colores</td>
    <td>2.50</td>
    <td>5</td>
    <td>12.50</td>
  </tr>
 
  <tr>
    <td>Reproductor de radio & control remoto</td>
    <td>12.99</td>
    <td>1</td>
    <td>12.99</td>
  </tr>
 
  <tr>
    <th scope="row">TOTAL</th>
    <td>-</td>
    <td>7</td>
    <td><b>207.51</b></td>
  </tr>
</table>