En un principio nos podría parecer que las tablas son raramente útiles y que pueden ser utilizadas principalmente para listar datos como agendas, resultados y otros datos de una forma organizada. Nada más lejos de la realidad.
oy, gran parte de los diseñadores de páginas basan su maquetación en este tipo de artilugios. En efecto, una tabla nos permite organizar y distribuir los espacios de la manera más optima. Nos puede ayudar a generar texto en columnas como los periódicos, prefijar los tamaños ocupados por distintas secciones de la página o poner de una manera sencilla un pie de foto a una imagen.
Puede que en un principio nos resulte un poco complicado trabajar con estas estructuras pero, si deseamos crear una página de calidad, tarde o temprano tendremos que vérnoslas con ellas y nos daremos cuenta de las posibilidades nos ofrecen.
Para empezar, nada más sencillo que por el principio: las tablas son definidas por las etiquetas table> y /table>
Las tablas son descritas por líneas de izquierda a derecha. Cada una de estas líneas es definida por otra etiqueta y su cierre: tr> y /tr> (Filas)
Asimismo, dentro de cada línea, habrá diferentes celdas. Cada una de estas celdas será definida por otro par de etiquetas: td> y /td>. Dentro de estas etiquetas será donde coloquemos nuestro contenido.
table>
tr>
td>Celda 1, linea 1 /td> td> Celda 2, linea 1 /td>
/tr>
tr>
td> Celda 1, linea 2 /td>
td> Celda 2, linea 2 /td> /tr>
/table>
Atributos que tiene la Tablas y Celdas:
align = Justifica el texto de la celda del mismo modo que si fuese el de un párrafo. (Left, center, Rigth)
valign = Podemos elegir si queremos que el texto aparezca arriba (top), en el centro (middle) o abajo (bottom) de la celda.
bgcolor = Da color a la celda o línea elegida.
bordercolor = Define el color del borde.
Otros atributos que pueden ser únicamente asignados a una celda y no al conjunto de celdas de una línea son:
background = Nos permite colocar un fondo para la celda a partir de un enlace a una imagen.
height = Define la altura de la celda en pixels o porcentaje.
width = Define la anchura de la celda en pixels o porcentaje.
colspan = Expande una celda horizontalmente.
rowspan = Expande una celda verticalmente.
Ejercicio que se dejo en Clase:
