Taller

>> Taller >> Curso de HTML by BenKo >> Cap. 7, Las odiadas tablas.

Capítulo 7

Las odiadas tablas

Aaaagghhh!!! Tablas...Las odio. Kuando estaba aprendiendo HTML nunca me gustaron porque eran muy pesadas de hacer (y de aprender). De todas maneras, tarde o temprano tendrás que utilzar las tablas, porque la verdad es que son muy útiles.

Etiquetas necesarias para hacer una tabla:

<TABLE> Marca el comienzo de la tabla. Y atención porke esta etiqueta tiene cantidad de parámetros (todos ellos optativos, afortunadamente):

WIDTH: Ancho de la tabla. Se pone de manera absoluta (cantidad de pixels) o relativa al tamaño de la pantalla (%). De no indicar ningún tamaño la tabla se adapta al contenido.

BORDER: Grosor del borde de la tabla. Por defecto es 1. Si no quieres borde tienes que poner un 0.

BACKGROUND: Imagen de fondo.

BGCOLOR: Color de fondo

BORDERCOLOR: Color del borde

BORDERCOLORDARK: Color del lado sombreado del borde.

BORDERCOLORLIGHT: Color del lado iluminado del borde.

<TR> Etiqueta que empieza una nueva fila.
<TD> Crea una celda. También hay bastantes parámetros:

ALIGN: Alineación del texto interior. Puede tomar estos valores: RIGHT (derecha), CENTER (centro) y LEFT (izquierda). Valor por defecto LEFT

VALIGN: Alineación vertical del centro. Estos valores: TOP (arriba) MIDDLE (centro) y BOTTOM (abajo). Valor por defecto MIDDLE.

ROWSPAN: Número de filas que okupa.

COLSPAN: Número de columnas ke okupa.

WIDTH, BACKGROUND, BGCOLOR, BORDERCOLOR, BORDERCOLORDARK y BORDERCOLORLIGHT: Igual que la etiqueta <TABLE>

<TH> Igual que la anterior, sólo que el texto de la celda aparece en negrita. Se usa para poner títulos.

Ahora sabrás por qué odio las tablas... Komo supongo que lo de arriba habrá sido una especie de shock, vamos a tomarnos las cosas con calma. Una tabla sencillita de 2x2:

<TABLE>

<TR>

	<TD>AAA</TD>

	<TD>BBB</TD>

</TR>

<TR>

	<TD>CCC</TD>

	<TD>DDD</TD>

</TR>

</TABLE>

AAA	BBB
CCC	DDD

Bieeeeen....Ahora lo mismo, pero con celdas de encabezamiento.

<TABLE>

<TR>

	<TH>AAA</TH>

	<TH>BBB</TH>

</TR>

<TR>

	<TD>CCC</TD>

	<TD>DDD</TD>

</TR>

</TABLE>

AAA	BBB
CCC	DDD

Ahora hacemos una celda que okupe dos columnas, para ello usamos, COLSPAN:

<TABLE>

<TR>

	<TH COLSPAN=2>AAA</TH>

</TR>

<TR>

	<TD>BBB</TD>

	<TD>CCC</TD>

</TR>

</TABLE>

AAA
BBB	CCC

Guaauuuu...que chuli...Ahora vamos a hacer que una celda okupe dos filas y dos columnas (con ROWSPAN y COLSPAN):

<TABLE>

<TR>

	<TH ROWSPAN=2 COLSPAN=2>AAA</TH>

	<TH>BBB</TH>

</TR>

<TR>

	<TD>CCC</TD>

</TR>

</TABLE>

AAA		BBB
AAA		CCC

Y ahora que sabemos más o menos cómo funcionan las tablas, sólo nos queda enterarnos qué elementos pueden estar dentro de una tabla: CUALKIER KOSA: Imágenes, links, GIF's animados, formularios, etc.

Bueno, lo mejor para aprender a usar tablas es practicar, así que ya sabes. Experimenta con los parámetros, cambia los colores, el borde, etc.

¿A ké esperas? ¡Pilla el Bloc de Notas ya!

P' atrás | Principio | P' alante