Tablas

7
TABLAS EN HTML

Transcript of Tablas

Page 1: Tablas

TABLAS EN HTML

Page 2: Tablas

En HTML una  tabla  puede  ser considerada, como un grupo de filas donde cada una contiene a un grupo de celdas.

Page 3: Tablas

Las  tablas  se  construyen  utilizando  elementos, una  tabla  básica  es  declarada  usando  tres elementos: • <table> etiqueta que indica donde empezará la tabla </table> 

• <tr> representa una fila </tr>• <td> (representando a las celdas) </td>

Page 4: Tablas

Una celda de encabezado es una celda especial para organizar por categorías otras celdas de la tabla.Para agregar esta celda de este tipo se utiliza la etiqueta: <th>• <tr> empezar una fila• <th> para indicar que es celda de encabezado>• </tr> terminar la fila

tr

tr

tr

Page 5: Tablas

Atributos de la etiqueta <table>BORDER= Indica el tamaño del borde en píxeles.WIDTH= Es el ancho de la tabla.CELLSPACING= Espacio entre las celdas, por defecto es 2CELLPADDING= Es el espacio entre el contenido de las celdas y el borde de las mismas, por defecto es 1.ALIGN= " left", "right", "center". Alinea la tabla a la izquierda , derecha o al centro.

Page 6: Tablas

Atributos de las etiquetas <td> y <tr>

WIDTH= Ancho de toda la fila o celda.ALIGN=" left", "right", "center". Alinea el contenido a la izquierda, derecha o centro.VALIGN="top" , "middle" o "bottom". Alinea el contenido verticalmente arriba, en medio o abajo.BGCOLOR= Pone un fondo de color especifico a la celda o fila.COLSPAN= Especifica el número de columnas que abarca la fila.ROWSPAN= Especifica el número de filas que abarca la columna.

Page 7: Tablas

Los atributos colspan y rowspan permiten unir una celda con las celdas contiguas, tanto horizontal como verticalmente. COLSPAN= Indica la cantidad de celdas unidas en horizontal ROWSPAN= Indica la cantidad de celdas unidas en vertical.

El atributo span permite que una etiqueta <col /> haga referencia a varias columnas seguidas. SPAN= indica el número de columnas al que hace referencia la etiqueta <col />.

García Flores Nayeli Guadalupe

celdas a1 y b1 unidas

celda a2 celda b2

Celda 1 Celda 2 Celda 3

Celda 4 Celda 5 Celda 6