Tablas

Las tablas resultan muy útiles para la presentación de información tabular y son una bendición para los autores creativos.

Elementos

Los elementos que forman las tablas son los siguientes:

ElementoDescripción
<TABLE> ...
</TABLE>
Define una tabla en HTML. Si está presente el atributo BORDER el navegador mostrará la tabla con bordes.
<CAPTION> ...
</CAPTION>
Define la leyenda para titular la tabla. La posición por defecto es centrada sobre la tabla. Se puede usar el atributo ALIGN="BOTTOM" para posicionar la leyenda bajo la tabla.
<TR> ...
</TR>
Especifica una fila dentro de la tabla. Se pueden definir atributos por defecto para toda la fila: ALIGN (LEFT, CENTER, RIGHT) y/o VALIGN (TOP, MIDDLE, BOTTOM).
<TH> ...
</TH>
Define una celda de encabezado. Por defecto, el texto en esta celda aparece centrado y en negrita. Las celdas de encabezado pueden contener otros atributos para determinar las características de la celda y/o su contenido.
<TD> ...
</TD>
Define una celda de datos. Por defecto, el texto en esta celda aparece alineado a la izquierda y centrado verticalmente. Las celdas de datos pueden contener otros atributos para determinar las características de la celda y/o su contenido.

Atributos

AtributoDescripción
ALIGN (LEFT, CENTER, RIGHT)Alineación horizontal de una celda.
VALIGN (TOP, MIDDLE, BOTTOM)Alineación vertical de una celda.
COLSPAN="número_de_columnas"Número de columnas que abarca una celda
ROWSPAN="número_de_filas"Número de filas que abarca una celda
NOWRAPDesactiva la envoltura del texto en una celda.

Los atributos definidos en celdas de encabezado (<TH> ... </TH>) o en celdas de datos (<TR> ... </TR>) anulan la alineación establecida en <TR> ... </TR>.

Formato

El formato general de una tabla es el siguiente:
<TABLE>
  inicio de la definición de la tabla
<CAPTION> contenido de la leyenda </CAPTION>
  definición de la leyenda
<TR>
  inicio de la definición de la primera fila
<TH> contenido de la celda </TH>
  primera celda de la primera fila
<TH> contenido de la celda </TH>
  última celda de la primera fila
</TR>
  fin de la definición de la primera fila
<TR>
  inicio de la definición de la segunda fila
<TD> contenido de la celda </TD>
  primera celda de la segunda fila
<TD> contenido de la celda </TD>
  última celda de la segunda fila
</TR>
  fin de la definición de la segunda fila
<TR>
  inicio de la definición de la última fila
<TD> contenido de la celda </TD>
  primera celda de la última fila
<TD> contenido de la celda </TD>
  última celda de la última fila
</TR>
  fin de la definición de la última fila
</TABLE>
  fin de la definición de la tabla

Las etiquetas <TABLE> y </TABLE> deben rodear la definición entera de la tabla. El primer elemento en la tabla es la leyenda (CAPTION), que es opcional. Después se puede poner cualquier cantidad de filas definidas por las etiquetas <TR> y </TR>. Dentro de una fila se puede tener cualquier número de celdas definidas por las etiquetas <TD> ... </TD> o <TH> ... </TH>. El formato de cada fila de una tabla es independiente del resto, lo cual permite mostrar tablas de cualquier tipo y abarcar varias columnas en una sola celda.

Tablas para información no tabular

Algunos autores de documentos HTML utilizan las tablas para presentar información no tabular. Por ejemplo, ya que los enlaces pueden ser incluidos en las celdas de una tabla, hay quien usa las tablas sin bordes para crear recuadros, consiguiendo que el resultado parezca un mapa (una imagen con cuadrantes enlazados).



Anterior Siguiente
Sumario | Inicio