Creacion de tablas en html

Solo disponible en BuenasTareas
  • Páginas : 5 (1192 palabras )
  • Descarga(s) : 0
  • Publicado : 26 de abril de 2011
Leer documento completo
Vista previa del texto
Creación de Tablas en HTML

Presentado por la Alumna Paola Andrea Vargas Mario en la Asignatura de Informática Al Lic. Rafael Mercado

Colegio Distrital Maria Auxiliadora
903
2010
Creación De tablas en HTML
Una tabla en un conjunto de celdas organizadas dentro de las cuales podemos alojar distintos contenidos.
En un principio nos podría parecer que las tablas son raramente útiles y quepueden ser utilizadas principalmente para listar datos como agendas, resultados y otros datos de una forma organizada. Nada más lejos de la realidad.
Hoy, 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 losperió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ássencillo que por el principio: las tablas son definidas por las etiquetas y .
Dentro de estas dos etiquetas colocaremos todas las otras etiquetas, textos e imágenes que darán forma y contenido a la tabla.
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: y
Asimismo, dentro de cada línea, habrá diferentesceldas. Cada una de estas celdas será definida por otro par de etiquetas: y . Dentro de estas etiquetas será donde coloquemos nuestro contenido. Aquí tenéis un ejemplo de estructura de tabla:


Celda 1, linea 1
Celda 2, linea 1


Celda 1, linea 2
Celda 2, linea 2


Hemos visto en el capitulo anterior que las tablas están compuestas de líneas que, a su vez, contienen celdas.Las celdas son delimitadas por las etiquetas o por las etiquetas (si queremos texto en negrita y centrado) y constituyen un entorno independiente del resto del documento. Esto quiere decir que:

•Podemos usar prácticamente cualquier tipo de etiqueta dentro de la etiqueta para, de esta forma, dar forma a su contenido.
•Las etiquetas situadas en el interior de la celda no modifican el restodel documento.
•Las etiquetas de fuera de la celda no son tenidas en cuenta por ésta.
Así pues, podemos especificar el formato de nuestras celdas a partir de etiquetas introducidas en su interior o mediante atributos colocados dentro de la etiqueta de celda o bien, en algunos casos, dentro de la etiqueta , si deseamos que el atributo sea valido para toda la línea. La forma más útil y actual dedar forma a las celdas es a partir de las hojas de estilo en cascada que ya tendréis la oportunidad de abordar más adelante.
Veamos a continuación algunos atributos útiles para la construcción de nuestras tablas. Empecemos viendo atributos que nos permiten modificar una celda en concreto o toda una línea:
align Justifica el texto de la celda del mismo modo que si fuese el de un párrafo.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 unaimagen.
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.

Nota: El atributo height no funciona en todos los navegadores, además, su uso no está muy extendido. Las celdas por lo general tienen el alto que ncesitan para que quepa...
tracking img