Les taules també són un element HTML molt emprat, tot i que ara amb els estils CSS es recomana l'ús d'aquestes enlloc de les taules a l'hora de realitzar una pàgina. Per això les taules haurien de quedar reservades només pel ús que sempre els ha correspost. Ja sigui una relació o una exposició de dades.
Les taules utilitzen l'etiqueta TABLE , que es posa al inici i al final de la taula: < TABLE > </ TABLE >
Entre aquet TAG hi ha d'haver els TAGs corresponents a les columnes i les files.
<TR> </TR> Table Row, que pertany a les columnes.
<TD> </TD> Table Data Cell, que pertany a les files.
S'han de combinar apropiadament les columnes i les files per formar les taules. A continuació tenim un exemple de com fer les taules.
Codi:
<table border="1">
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
</tr>
<tr>
<td>G</td>
<td>H</td>
<td>I</td>
</tr>
</table>
Taula:
| A | B | C |
| D | E | F |
| G | H | I |
A continuació facilito una taula on es mostren els atributs que accepten cada TAG esmentat.
Nom - atribut |
TABLE |
TR |
TD |
Border |
x |
- |
- |
Row Span |
- |
- |
x |
Colspan |
- |
- |
x |
Align |
- |
x |
x |
Valign |
- |
- |
x |
Width |
x |
- |
x |
Height |
x |
x |
x |
CellPadding |
x |
- |
- |
CellSpacing |
x |
- |
- |
Bordercolor |
x |
- |
- |
Bgcolor |
x |
- |
x |
Perquè no hi hagi dubtes en els noms dels atributs:
Border: gruix de la vora de la taula.
RowSpan: número de columnes que ocuparà una fila.
ColSpan : número de files que ocuparà una columna. Exemple:
Codi:
<table border="1">
<tr>
<td>A</td>
<td colspan="2">B</td>
</tr>
<tr>
<td rowspan="2">D</td>
<td>E</td>
<td>F</td>
</tr>
<tr>
<td>H</td>
<td>I</td>
</tr>
</table>
Taula:
| A | B | |
| D | E | F |
| H | I | |
Align: l'alineació que pot ser center, right or left; (centre, dreta o esquerra respectivament).
Valign: l'alineació del text respecte la cel·la, pot ser top, bottom o middle; (a dalt, a baix, o al mig; respectivament).
Width: l'amplada.
Height: L'alçada.
CellPadding: La distància entre el text i la vora de la cel·la.
CellSpacing: La distancia entre celes.
Bordercolor: Color de la vora.
Bgcolor: color de fons de cada cel·la.