Delicious LinkedIn Facebook Twitter RSS Feed

Uso de Tablas HTML para colocación de datos y diseño web-Blog

Las tablas fueron diseñadas por científicos de las universidades para contener y organizar información, no como una ayuda para el diseño gráfico de la página, ya que en esa época el lenguaje y las páginas web se concebían como una forma de transmitir texto plano, en monitores monocromos y de poca resolución, y no fue hasta el posterior desarrollo de Internet, de la WWW y de la tecnología de ordenadores personales avanzados cuando se empezó a tener en cuenta la importancia del diseño visual de una página web como un medio global para transmitir no solo texto plano, si no también contenidos gráficos y multimedia.



Este es el caso que os presento hoy una tabla que e personalizado "para dos de mis blogs" y ahora os la ofrezco a todos,es simple,esto es de lo que partimos...

<table border="black" height="100%" cellspacing="3" width="100%" background="http://www.AQUI LA DIRECCIÓN DE LA IMAGEN DESEADA PARA EL FONDO...jpg" border="5">

<tbody>
<TR>

<TD> celda(1,1) </TD>

<TD> celda(1,2) </TD>

<TD> celda(1,3) </TD>

</TR>

<TR>

<TD> celda(2,1) </TD>

<TD> celda(2,2) </TD>

<TD> celda(2,3) </TD>

</TR>

</TABLE></tbody>




-Copiad todo el código anterior y si necesitáis mas "celdas" tan solo debéis añadir "antes de " "añadir tantos codigos como el siguiente necesiteis:

<tr><td> celda(2,1) </td>

<td> celda(2,2) </td>

<td> celda(2,3) </td>

</tr
>

-Es muy sencillo,además al principio del código veis valores como: bordercolor (cambiar color del borde),height o width (tamaño,"esta en automático" 100% significa que aprovecha el espacio donde se ponga y se adapta)...cellspanding (lineas interiores),y border(el borde o "marco" grosor),cambiar los valores según sea preciso.

*Ejemplo: www.motogpmotor.blogspot.com/ o www.formula1motor.blogspot.com/

-Como resultado podéis obtener algo así:

J. Button / Brawn 10
R. Barrichello / Brawn 8
J. Trulli / Toyota 6
T. Glock / Toyota 5
F. Alonso / Renault 4
N. Rosberg / Williams 3

0 comments:

Post a Comment