| Rojo | Amarillo | Azul | |
|---|---|---|---|
| Rojo | Rojo | Naranja | Púrupura |
| Amarillo | Naranja | Amarillo | Verde |
| Azul | Púrpura | Verde | Azul |
Simplemente en la vista HTML de la entrada se digita el código respectivo, así:
<table border="1" cellpadding="4"><tbody>
<tr bgcolor="pink"><th></th><th>Rojo</th>
<th>Amarillo</th>
<th>Azul</th></tr>
<tr><th>Rojo</th>
<td>Rojo</td>
<td>Naranja</td>
<td>Púrupura</td></tr>
<tr><th>Amarillo</th>
<td>Naranja</td>
<td>Amarillo</td>
<td>Verde</td></tr>
<tr><th>Azul</th>
<td>Púrpura</td>
<td>Verde</td>
<td>Azul</td></tr>
</tbody></table>
Obviamente, en vez de colores, podemos incluir otras palabras, frases, párrafos, imágenes, etc. Si queremos que la tabla no tenga borde quitamos el atributo "border" de la etiqueta <table>.
Si queremos que la tabla se adapte al ancho del blog utilizamos una orden CSS en la etiqueta <table> que es: style="width:100%;", además le vamos a dar color al borde con: bordercolor"blue" y a aumentar su tamaño, así:
<table style="width:100%;" bordercolor="blue" border="5" cellpadding="4"><tbody>
La tabla quedaría así:
| Rojo | Amarillo | Azul | |
|---|---|---|---|
| Rojo | Rojo | Naranja | Púrupura |
| Amarillo | Naranja | Amarillo | Verde |
| Azul | Púrpura | Verde | Azul |
O se puede insertar una imagen como fondo de tabla arreglando la etiqueta <table> así (observar que no importa el orden de los atributos):
<table background="url de la imagen" border="5" cellpadding="5" style="width:100%;"><tbody>
| Rojo | Amarillo | Azul | |
|---|---|---|---|
| Rojo | Rojo | Naranja | Púrupura |
| Amarillo | Naranja | Amarillo | Verde |
| Azul | Púrpura | Verde | Azul |
