TABLA 3
Atributos a Nivel de Filas
Como hemos visto los
atributos en las Tablas pueden ir definidos a nivel de
Tabla
... Fila o Celda
A continuación
veremos los principales atributos a nivel de Fila
contenidos dentro de la
etiqueta
<TR>
ALIGN
Este atributo nos servirá para
indicar la Alineación Horizontal
de los elementos de todas las Celdas de la Fila
Contiene tres valores
definidos que son ...
Left ... Alineados a la izquierda
Right ... Alineados a la derecha
Center
... Centrados
Su estructura será así
según su posición ...
<TR
ALIGN="
left / right / center
">
VALIGN
Este atributo nos servirá para indicar la Alineación Vertical
de los elementos de todas las Celdas de la Fila
También posee tres valores
definidos ...
Top ... En la parte superior de la celda
Bottom ... En la parte inferior de la celda
Center ...
En el centro de la celda
Su estructura será así
...
<TR
VALING=
" top / bottom / right
">
BORDERCOLOR
Con este atributo
podremos determinar el Color del Borde
para todas las Celdas de una misma
Fila ...
Podremos asignarle un color
mediante su Nombre de Texto
o su Valor Hexadecimal
Su estructura será así
...
<TR
BORDERCOLOR="
#FF0000"
<TR BORDERCOLOR="NOMBRE DEL
TEXTO" ...
"RED"
BGCOLOR
Con este atributo
podremos definir el Color de cada Fila
también mediante el Nombre del
Texto o el Valor Hexadecimal
Su estructura será así
...
<TR
BGCOLOR="
#FF0000"
<TR BGCOLOR="NOMBRE DEL TEXTO"
"RED"
Veremos también como darle
Opacidad o Transparencia a Nuestra Tabla
como Sombra a Nuestros Border's
...
Dependiendo del número elegido
será el Valor Alpha o Transparencia
entre más pequeño más transparencia y
visceversa ...
style="FILTER:
alpha(opacity=50);
Para Los Boder's será ...
Border Claro
...
borderColorLight=#FFFFFF
que puede ir en Texto o el Valor Hexadecimal en ambos
casos
Border Obscuro ...
borderColorDark=#000000
Aquí su Formato que vamos
a sustituir en Nuestra Tabla original ...
<TABLE style="FILTER:
alpha(opacity=50); WIDTH: 600px; HEIGHT: 400px"
borderColor=#FF0000
cellSpacing=15 borderColorDark=#000000 cellPadding=25
width=635 align=center
bgColor=#FFFFFF borderColorLight=#FFFFFF border=5>
<TBODY>
Tomando el ejemplo anterior lo
modificaremos con los atributos señalados
y veremos cual es el
resultado ...
Código
Tabla 3
<TABLE borderColor=red
height="75%" cellSpacing=10 cellPadding=15 width="50%"
align=center
bgColor=black border=5>
<TBODY>
<TR
vAlign=bottom align=left borderColor=red
bgColor=#FFFFFF>
<TH>
<DIV align=center>Cabecera
1</DIV></TH>
<TH>
<DIV align=center>Cabecera
2</DIV></TH>
<TH>
<DIV align=center>Cabecera
3</DIV></TH></TR>
<TR vAlign=top align=right
borderColor=#FF0000 bgColor=#FFFFFF>
<TD>Celda
1-1</TD>
<TD>Celda
1-2</TD>
<TD>Celda
1-3</TD></TR>
<TR vAlign=center align=middle
borderColor=#FF0000 bgColor=#FFFFFF>
<TD>Celda
2-1</TD>
<TD>Celda
2-2</TD>
<TD>Celda
2-3</TD></TR></TBODY></TABLE></BODY></HTML>
|
Cabecera 1 |
Cabecera 2 |
Cabecera 3 |
|
Celda
1-1 |
Celda
1-2 |
Celda
1-3 |
|
Celda
2-1 |
Celda
2-2 |
Celda
2-3 |
Suerte ... !!!
