tablas en html _informatica_mitzi_1b

Post on 14-Aug-2015

141 Views

Category:

Internet

2 Downloads

Preview:

Click to see full reader

TRANSCRIPT

TABLAS EN HTML

MITZI MELINA GARCIA HERNANDEZ.PROF.AZUCENA CERVANTES INFORMATICA II 1B 28-05-15

El modelo de tablas de HTML permite a los autores organizar datos -- textos, texto preformateado, imágenes, vínculos, formularios, campos de formularios, otras tablas, etc. -- en filas y en columnas de celdas.

Cada tabla puede tener un título asociado que proporciona una descripción corta del propósito de de la tabla. Se puede proporcionar también una descripción más larga para el provecho de las personas que utilicen agentes de usuario basados en Braille o en voz.

QUE ES UNA TABLA EN HTML?

Las filas de una tabla pueden agruparse en secciones de encabezado, pie y cuerpo. Los autores también pueden agrupar columnas para proporcionar información estructural adicional de la que pueden sacar partido los agentes de usuario. Las celdas pueden ocupar varias filas y columnas.

DENTRO DE LA TABLA

La etiqueta <tr> se utiliza para definir una fila dentro de una tabla.Este elemento puede contener una o más etiquetas <th> o <td>.

¿Qué significa “tr”?

La etiqueta <td> define una celda que contiene datos dentro de una tabla.

El texto de esta celda se representa en tamaño regular y alineado a la izquierda.

¿Qué significa “td”?

las tablas tienen dos modos de presentacion de los bordes que se selecciona con la propiedad border-collapse: separado (separate) y colapsado (collapse). en el modo eparado existe un hueco entre los bordes cada lda, mientras que en el modo colapsao los bordes se superponen. los navegadores aplican el modo separado.

¿Cómo insertas un simple borde en tu tabla?

<TABLE> y </TABLE> son las etiquetas donde está contenida la tabla

<TR> y </TR> son las etiquetas que indican el comienzo y fin de una fila (<th> y </th> si es una fila de cabecera)

<TD> y </TD> señalan una celda.

TABLA INVISIBLE

para la unificación horizontal de celdas, utilizaremos el atributo de celda “colspan”.

COLSPAN

para la unificación vertical de celdas, utilizaremos el atributo de celda “rowspan”.

¿Qué es “rowspand?

Aplicación de COLSPAN Y ROWSPAN

Este atributo permite determinar o especificar la distancia entre las celdas y entre las celdas y el margen exterior de la tabla. El valor de este atributo se mide en pixeles y es válido para todas las celdas.

¿Qué es “cellspacing”?

Este atributo nos permite especificar la distancia entre el margen interior de la celda y su contenido. En el caso de este atributo, si su valor es en pixeles los cuatro bordes de la celda deberían estar a la distancia indicada del contenido. En cambio si el valor es un porcentaje, los bordes superior e inferior estarán separados a una distancia porcentual del valor disponible verticalmente y lo mismo para los bordes derecho e izquierdo que estarán separados al porcentaje indicado del espacio disponible horizontalmente.

¿Qué es “cell spacing”?

Para cambiar del color de fondo, basta con escribir la directiva BGCOLOR dentro del elemento que de la tabla que se desee cambiar.

Para cambiar el color a la tabla

<TABLE BGCOLOR="codigo de color">

Para cambiar el color a la fila

<TR BGCOLOR="codigo de color">

¿Cómo insertas color de fondo en una celda de una tabla?

Para colocar una imagen defondo en tu tabla simplemente se utiliza BACKGROUN dentro de la etiqueta <table ….>

¿Cómo insertas una imagen de fondo en una tabla?

Para alinear el texto se utiliza align dentro de la etiqueta <td>

Ejemplo; <td align=“center”> </td>

¿cómo alineas el contenido de tu tabla?

FORMATO APAConclase(2014)tabla html,recuperado el 28-05-15 en : http://html.conclase.net/w3c/html401-es/struct/tables.html#h-11.1

virtual(2014)que es tr,recuperado el 28-05-15 en : http://www.virtualnauta.com/html-etiqueta-tr

Conclase(2014)tabla html,recuperado el 28-05-15 en : http://www.mclibre.org/consultar/amaya/css/css_tablas_modos_bordes.html#Modosplatea(2014)guia html tabla,recuperado el 28-05-15 en : http://platea.pntic.mec.es/~abercian/guiahtml/tablas.htm

Aprender a programar (2014)colocar img en tabla,recuperado el 28-05-15 en : http://aprenderaprogramar.com/index.php?option=com_content&view=article&id=516:crear-tablas-html-colspan-y-rowspan-unir-celdas-horizontal-y-vertical-tr-td-th-caption-o-titulo-cu00719b&catid=69:tutorial-basico-programador-web-html-desde-cero&Itemid=192

yahoo(2014)alineacion texto tabla,recuperado el 28-05-15 en : https://mx.answers.yahoo.com/question/index?qid=20070726132643AAQjAhu

top related