HTML Tablas segunda parte

Tablas en HTML
Continuamos con las tablas en HTML que ya comenzamos en la primera parte.

Para otorgar de propiedades a nuestra tabla vamos a ver algunos atributos.

Caption
La etiqueta caption otorgará a la tabla de un rótulo en la parte superior, deberá añadirse dicha etiqueta justo después de la etiqueta table
<caption>Título de la tabla</caption>

Border
Para añadir bordes alrededor de las celdas usaremos el atributo border colocándolo dentro de la etiqueta <table> de la siguiente forma:

<table border="4"> </table>

Esto creará un borde alrededor de cada celda para que la tabla resulte más estructurada.

Cellpadding
Este atributo crea un espaciado entre las celdas, aumentando el número se ampliará el espacio en todos los sentidos. El atributo afecta a la etiqueta <table>
<table cellpadding="3"></table>

Componiendo estos 3 atributos escribimos el siguiente código:

<table border="1" cellpadding="2">
<caption>La poderosa tabla</caption> 
<tr>
<td>A1</td><td>A2</td><td>A3</td>
</tr>
<tr>
<td>B1</td><td>B2</td><td>B3</td>
</tr>
<tr>
<td>C1</td><td>C2</td><td>C3</td>
</tr>
</table>

Y obtenemos el siguiente resultado:

La poderosa tabla

A1	A2	A3
B1	B2	B3
C1	C2	C3

Ahora cambiaré un atributo:

<table border="4" cellpadding="2">
<caption>La poderosa tabla</caption> 
<tr>
<td>A1</td><td>A2</td><td>A3</td>
</tr>
<tr>
<td>B1</td><td>B2</td><td>B3</td>
</tr>
<tr>
<td>C1</td><td>C2</td><td>C3</td>
</tr>
</table>

Quedando finalmente así:

La poderosa tabla

Aaaa1	Aaaa2	Aaaa3
B1	B2	B3
C1	C2	C3

¿No os da la impresión de que la tabla tiene un aspecto de baldosa modular? Aquí tenemos un ejemplo de como lograr mucho con pocos conocimientos.

Continua con la tercera parte sobre tablas