Algunas tablas
Las tablas son una poderosa herramienta, y no sólo para mostrar infinidad de datos sino también para formatear los documentos (aunque no debemos abusar al respecto, por razones que veremos luego).
Hay multitud de códigos relacionados con las tablas, aunque muchos de ellos sólo funcionan en un determinado navegador por lo que no los estudiaremos aquí.
La base de una tabla la constituyen los siguientes códigos...
| WS
| Código
| Atributos
| Descripción
|
![[En WebScope]](wsicons/26.gif) |
TABLE |
border cellpadding cellspacing |
Código principal de una tabla, engloba a todos los siguientes. |
![[En WebScope]](wsicons/27.gif) |
TR |
align bgcolor bordercolor bordercolordark bordercolorlight valign |
Fila. |
![[En WebScope]](wsicons/29.gif) |
TD |
align background bgcolor bordercolor bordercolordark bordercolorlight colspan height nowrap rowspan valign width |
Celda. |
![[En WebScope]](wsicons/36.gif) |
TH |
align background bgcolor bordercolor bordercolordark bordercolorlight colspan height nowrap rowspan valign width |
Celda de cabecera de columna. Normalmente se formatea en negrita. |
![[En WebScope]](wsicons/37.gif) |
CAPTION |
align valign |
Éste código marca el título de la tabla. Éste código es externo a la tabla y por tanto se coloca ANTES del código TABLE. |
Su uso es anidado, veamos un ejemplo...
<table>
<tr>
<td>A</td><td>B</td><td>C</td><td>D</td>
</tr>
<tr>
<td>E</td><td>F</td><td>G</td><td>H</td>
</tr>
<tr>
<td>I</td><td>J</td><td>K</td><td>L</td>
</tr>
</table>
Una vez que ya hemos conocido los cimientos, veamos los principales atributos que nos ayudarán a potenciar nuestra tabla...
| WS
| Atributo
| Descripción
|
| |
align |
Alineado horizontal del contenido de la celda. |
![[En WebScope]](wsicons/38.gif) |
background |
URL de una imagen de fondo para la tabla o celda. |
![[En WebScope]](wsicons/39.gif) |
bgcolor |
Color de fondo de la tabla o celda. |
![[En WebScope]](wsicons/31.gif) |
border |
Muestra el borde de la tabla. |
![[En WebScope]](wsicons/39.gif) |
bordercolor |
Color del borde de la tabla. |
![[En WebScope]](wsicons/39.gif) |
bordercolordark |
Color de la línea oscura del efecto 3D del borde. |
![[En WebScope]](wsicons/39.gif) |
bordercolorlight |
Color de la línea clara del efecto 3D del borde. |
![[En WebScope]](wsicons/31.gif) |
cellpadding |
Margen interior de una celda. |
![[En WebScope]](wsicons/31.gif) |
cellspacing |
Espaciado entre celdas. |
![[En WebScope]](wsicons/30.gif) |
colspan |
Ocupa varias celdas de la misma fila. |
| |
height |
Altura de una celda o tabla. |
| |
nowrap |
Impide la ruptura de la línea interior para ajustarla con el ancho de la celda. |
![[En WebScope]](wsicons/28.gif) |
rowspan |
Ocupa varias celdas de la misma columna. |
| |
valign |
Alineamiento vertical del contenido de una celda. |
| |
width |
Ancho de una celda o tabla. |
Dicen que un ejemplo vale más que mil palabras ¿no?, pues veamos uno...
Marcos y ventanas
|