TABLAS

Las tablas pueden resultarnos útiles en muchas ocasiones. A continuación tienes ejemplos de las diferentes posibilidades que nos ofrecen.
2. LAS CELDAS
3. TAMAÑO DE BORDE
4. FORMATO DE BORDE
5. COLOR DE BORDE
6. ESPACIO DENTRO DE LA CELDA (CELLPADDING)
7. SEPARACIÓN ENTRE CELDAS (CELLSPACING)
8. COMBINAR CELDAS EN UNA ÚNICA COLUMNA (ROWSPAN)

1. FORMATO BÁSICO DE UNA TABLA.

Primero, debemos recordar que todos los elementos de una tabla deben abrirse < > y cerrarse </ >. 

 
Así, el formato básico de una tabla será el siguiente:
Para poder trabajar mejor con la celda, podemos añadirle un borde:

2. LAS CELDAS.

Podemos añadir todas las celdas y columnas que consideremos necesarias:







 

3. TAMAÑO DE BORDE.

Para modificar el tamaño del border simplemente debemos aumentar el valor de la orden "border":








4. FORMATO DE BORDE.

Para modificar el formato del borde debemos incluir una nueva orden "style=border: nombre del estilo".

Sustituiremos "nombre del estilo" por alguno de los diferentes estilos: none, solid, ridge, dotted, double, inset, outset, dashed o groove.


























5. COLOR DE BORDE.

Si queremos cambiar el color del borde utilizaremos la orden "bordercolor=color". 

IMPORTANTE:  Siempre debemos escribir el nombre del color en inglés.




O también podemos escribir, en vez del nombre del color, su código hexadecimal:




6. ESPACIO DENTRO DE LA CELDA (CELLPADDING).

Para aumentar el espacio dentro de un celda o, lo que es lo mismo, la separación entre el contenido de dicha celda y su borde, debemos utilizar la orden cellpadding. Según vayamos aumentando la numeración, el espacio será mayor.










7. SEPARACIÓN ENTRE CELDAS (CELLSPACING).

Si lo que queremos es aumentar el espacio entre celdas, sin variar el espacio interior, utilizaremos la orden cellspacing.








8. COMBINAR CELDAS EN UNA ÚNICA COLUMNA (ROWSPAN).

Para combinar celdas en una misma columna debemos utilizar la orden rowspan.

Colocaremos la orden, siempre dentro del comando <td rowspan=>...</td>, no dentro del comando <table>, en el puesto de la columna que queremos combinar. Así, en el primer ejemplo, al combinar la columna número 2, colocaremos la orden rowspan dentro de la segunda <td>.

En el segundo ejemplo queremos combinar la columna número 1, así que colocaremos la orden rowspan dentro de la primera <td>.  

Y en el tercer ejemplo combinaremos la columna número 3, colocando entonces la orden rowspan dentro de la tercera <td>. 



















Suscribirse a: Entradas (Atom)