Insertar tablas en Blogger

Pregunta Ricardo de Alicante, España cómo crear tablas en las entradas del blog. Si bien es algo sencillo requiere de un poco de atención para poder entender, así que haré mi mayor esfuerzo para explicarme.

El código básico para insertar una tabla es el siguiente:

<table border="1" cellpadding="4"><tbody>
<tr><td>Mesa</td>
<td>Silla</td>
<td>Cama</td></tr>
<tr><td>Carro</td>
<td>Barco</td>
<td>Avión</td></tr>
<tr><td>Lunes</td>
<td>Martes</td>
<td>Miércoles</td></tr>
</tbody></table>

El resultado es este:

Mesa	Silla	Cama
Carro	Barco	Avión
Lunes	Martes	Miércoles

Nótese que las tres primeras palabras forman la primera fila, luego las otras tres forman la segunda fila y las tres últimas la tercera fila. Si deseas insertar una fila más agrega esta parte antes de </tbody></table>

<tr><td>Palabra 1</td>
<td>Palabra 2</td>
<td>Palabra 3</td></tr>

Del mismo modo si quisieras que cada fila tuviera más celdas entonces agrega las que quieras añadiendo las palabras entre las etiquetas <td> </td> antes de cada </tr>

Ya teniendo claro esto, ahora podemos personalizar las tablas añadiendo unos atributos.
El borde de la tabla es el más delgado, si lo quieres más grueso cambia border="1" por un número más alto, si lo dejas en "0" se quedará sin borde.

<table border="5" cellpadding="4"> <tbody><tr><td>Tabla con borde "5"</td></tr> </tbody></table>

Para cambiar el color del borde de la tabla añadimos después de <table el atributo
bordercolor="green" el color lo puedes cambiar, por ejemplo "red"

<table border="2" bordercolor="green" cellpadding="4"> <tbody><tr><td>Tabla con borde verde</td></tr> </tbody></table>

Si quieres usar un color de fondo en toda la tabla agrega bgcolor="yellow" después de <table. El color lo puedes cambiar.

<table border="2" bgcolor="yellow" cellpadding="4"> <tbody><tr><td>Tabla con fondo amarillo</td></tr> </tbody></table>

Este efecto también lo puedes agregar sólo a las celdas que quieras para que cada fila tenga distintos colores. Para hacer eso se usa el mismo atributo, pero en vez de ponerlo después de <table lo pones después de la etiqueta <tr por ejemplo:

Fila café	Fila café
Fila gris	Fila gris

Este fue el código para hacer eso:

<table border="1" cellpadding="6">
<tbody><tr bgcolor="brown">
<td>Fila café</td><td>Fila café</td></tr>
<tr bgcolor="grey">
<td>Fila gris</td><td>Fila gris</td></tr>
</tbody></table>

También puedes poner una imagen de fondo en la tabla, para lograr eso agrega background="URL de la imagen" después de <table. Yo he puesto una imagen animada (.gif) en el ejemplo.

Tabla con fondo de imagen

Tabla con fondo de imagen

<table background="URL de la imagen" border="1" cellpadding="4">
<tbody><tr><td>Tabla con fondo de imagen</td>
<td>Tabla con fondo de imagen</td></tr>
</tbody></table>

Como verás después de entender el código básico todo lo demás resulta fácil. De cualquier modo puedes probar los resultados y variaciones en un blog de pruebas antes de publicarlo.