Curso HTML 5: Tablas
Aunque parezca mentira, las tablas son muy fáciles de hacer en HTML, tan sólo usaremos <table>al inicio y final de la tabla, <tr> para cada fila y <td> para cada columna.
Pongamos que queremos hacer una tabla con 2 columnas y 4 filas. Pondríamos 4 <tr> y dentro de ellos 2 <td> cada vez.
<table><tr><td><b>Nombre</b></td> <td><b>Color</b></td></tr></table>
Esta línea que acabo de escribir quedaría tal que así:
| Nombre | Color |
Ahora vamos a probar a poner un fondo de color de celda:
Para ello usaremos el atributo "bgcolor", que significa background color. En español, color de fondo.
No hace falta hacer la tabla ocupando varias lineas, pero es mejor usar varios renglones escribiendo en vez de hacerlo de seguido para verlo mejor.
<table>
<tr><td bgcolor="aqua"><b>Nombre</b></td><td bgcolor="blue"><b>Color</b></td></tr>
</table>
| Nombre | Color |
Una vez ya sabemos esto, para hacer las demas filas pondremos color de fondo, pero sin ningun texto, y así se quedara una celda de color y sin nada.
A continuación os pondré el codigo de una tablaterminada
<table>
<tr><td><b>Nombre</b></td><td><b>Color</b></td></tr>
<tr><td>Aqua</td> <td bgcolor="Aqua"></td></tr>
<tr><td>Black</td> <td bgcolor="Black"></td></tr>
<tr><td>Blue</td> <td bgcolor="Blue"></td></tr>
<tr><td>Fuchsia</td> <td bgcolor="Fuchsia"></td></tr>
<tr><td>Gray</td> <td bgcolor="Gray"></td></tr>
<tr><td>Green</td> <td bgcolor="Green"></td></tr>
<tr> <td>Lime</td> <td bgcolor="Lime"></td></tr>
<tr> <td>Maroon</td> <td bgcolor="Maroon"></td></tr>
<tr> <td>Navy</td> <td bgcolor="Navy"></td> </tr>
<tr> <td>Olive</td> <td bgcolor="Olive"></td> </tr>
<tr> <td>Purple</td> <td bgcolor="Purple"></td> </tr>
<tr> <td>Red</td> <td bgcolor="Red"></td> </tr>
<tr> <td>Silver</td> <td bgcolor="Silver"></td> </tr>
<tr> <td>Teal</td> <td bgcolor="Teal"></td> </tr>
<tr> <td>White</td> <td bgcolor="White"></td>
</table>
Quedaría tal que así:
| Nombre | Color |
| Aqua | |
| Black | |
| Blue | |
| Fuchsia | |
| Gray | |
| Green | |
| Lime | |
| Maroon | |
| Navy | |
| Olive | |
| Purple | |
| Red | |
| Silver | |
| Teal | |
| White |
Espero que os haya gustado el tutorial y si teneis dudas consultad los post anterirores
Comentarios
No se pueden incorporar más comentarios a este blog.