Doom Wiki
Advertisement
Doom Wiki

Las tablas son sin duda uno de los elementos más potentes del HTML. Con pocos elementos se pueden conseguir efectos espectaculares. En el interior de las celdas de una tabla, que pueden ser con borde visible o invisible, se puede poner cualquier cosa: texto de cualquier tamaño y color, imágenes, links,etc.

Por supuesto, además de permitir cualquier contenido, tienen sus propios atributos de alineación tanto horizontal como vertical, y atributos de dimensionado. Por defecto se autodimensionan, es decir, se adaptan en tamaño a su contenido, pero también es posible definirlo de forma fija. Las tablas han sido utilizadas largo tiempo para maquetar el contenido de las páginas, y aunque las nuevas tendencias aconsejen hacer esto con bloques (capas XHTML), no es un elemento que vaya a desaparecer, y es mucho más sencillo de utilizar.

Elementos

El elemento básico de definición de una tabla es <TABLE> </TABLE> y en su interior se disponen los sub elementos:

  • <TR> para definir una fila (Row)
  • <TH> para definir una cabecera (Header)
  • <TD> para definir una celda de datos (Data).

Estos sub elementos también han de llevar sus correspondientes cierres: </TR> </TH> </TD>.

Una cabecera <TH> es lo mismo que una celda de datos <TD> pero de forma automática el texto de su contenido recibe los atributos de negrita y centrado. Sólo es posible definirlas al principio de las filas, de las columnas o de ambas a la vez.

He aquí una tabla resumen de los elementos utilizados y los atributos que admite cada uno:

Resumen de tablas
TABLE TR TD TH CAPTION
BORDER x - - - -
BORDERCOLOR x - - - -
ROWSPAN - - x x -
COLSPAN - - x x -
ALIGN - x x x x
VALIGN - - x - -
WIDTH x - x - -
HEIGTH x - x - -
CELLPADDING x - - - -
CELLSPACING x - - - -
NOWRAP - - x - -
EVENTS x x x x -

Ejemplos

Tabla básica con bordes

A B C
D E F

Línea extendida (rowspan)

elemento1 elemento2 elemento3
elemento4 lemento5

Columna extendida (colspan)

elemento1 elemento2
elemento3 elemento4 lemento5

Tabla con cabeceras / títulos

titulo1 titulo2 titulo3
A B C
D E F

Combinación de columna extendida y título

titulo1 titulo2
A B C D
E F G H

Combinación de cabeceras múltiples y columna extendida

titulo1 titulo2
titulo3 titulo4 titulo5 titulo6
A B C D
E F G H

Cabeceras laterales

titulo1 elemento1 elemento2 elemento3
titulo2 elemento4 elemento5 elemento6
titulo3 elemento7 elemento8 elemento9

Combinación de cabeceras laterales y líneas extendidas

titulo1 elemento1 elemento2 elemento3 elemento4
elemento5 elemento6 elemento7 elemento8
titulo2 elemento9 elemento10 elemento3 elemento11

Uso de colores de fondo

titulo en azul
celda roja celda verde

Uso de colores de texto

Hay dos formas de especificar el color del texto y del fondo para cada celda individualmente:

abc def otraforma jkl

Uso combinado

Los colores pueden también ser especificados para una fila completa o para una tabla completa; los parámetros para una fila sobrescriben los valores para la tabla, y los de una celda sobrescriben los de la fila:

abc def ghi
jkl mno pqr
stu vwx yz

Tamaño del texto e interlineado

TEXTO GRANDE
con interlineado pequeño
Texto normal
con interlineado normal
Texto pequeño
CON INTERLINEADO GRANDE

Fijar el ancho de una columna

A A

Pestañas básicas

Texto de muestra de la primera pestaña.

El contenido de la segunda pestaña va aquí.

El contenido de la tercera pestaña va aquí.


Véase también

Enlaces externos

Advertisement