11. Les tableaux - H.T.M.L.
Date de mise à jour : 3 janvier 2002

HTML 3 permet la fabrication de tableaux très visuels.
On utilise les commandes suivantes :
Déclare le début et la fin d'un tableau
<TABLE BORDER= CELLPADDING= CELLSPACING= WIDTH= HEIGHT= BGCOLOR=>
</TABLE>
BORDER=
- BORDER=0 le tableau n'a pas de contour
- BORDER=n le tableau a un contour d'épaisseur "n"
CELLPADDING=
- Définit l'espace entre l'objet et le contour d'une cellule
CELLSPACING=
- Définit l'épaisseur du trait entre les cellules
WIDTH=
- Fixe la largeur du tableau
HEIGHT=
- Fixe la hauteur du tableau
Définit le début et la fin d'une ligne
<TR ALIGN= BGCOLOR=>
</TR>
ALIGN=
- ALIGN=LEFT (par défaut) toutes les cellules de la ligne sont cadrées à gauche
- ALIGN=CENTER toutes les cellules de la ligne sont centrées
- ALIGN=RIGHT toutes les cellules de la ligne sont cadrées à droite
Définit chaque élément de la ligne titre
<TH COLSPAN= ROWSPAN= ALIGN= VALIGN= WIDTH= BGCOLOR=>
</TH>
Décrit chaque élément du tableau
<TD COLSPAN= ROWSPAN= ALIGN= VALIGN= WIDTH= BGCOLOR=>
</TD>
COLSPAN=
- COLSPAN=n (par défaut n=1) la cellule occupe n colonnes.
ROWSPAN=
- ROWSPAN=n (par défaut n=1) la cellule occupe n lignes.
ALIGN=
- ALIGN= alignement horizontal du contenu de la cellule.
- ALIGN=LEFT (valeur par défaut) alignement à gauche de la cellule.
- ALIGN=RIGHT alignement à droite de la cellule.
- ALIGN=CENTER centrage dans la cellule.
VALIGN=
- VALIGN= alignement vertical du contenu de la cellule.
- VALIGN=BOTTOM (valeur par défaut) alignement au bas de la cellule.
- VALIGN=TOP alignement au sommet de la cellule.
- VALIGN=CENTER centrage dans la cellule.
WIDTH=
- WIDTH= largeur de la cellule en pourcentage ou en pixel.
Décrit le titre du tableau
<CAPTION ALIGN=>
</CAPTION>
ALIGN=
- ALIGN=TOP (par défaut) la légende du tableau est en haut
- ALIGN=BOTTOM la légende du tableau est en bas
exemple :

<CENTER>
<TABLE BORDER BGCOLOR="#ccffaa">
<CAPTION>Comparatif modèle économique</CAPTION>
<TR>
<TH COLSPAN=3>Modèle
<TH ROWSPAN=2>Vitesse<BR>en km/heure
<TH ROWSPAN=2>Consommation<BR>en litre/100 km
</TR>
<TR>
<TH>Marque</TH>
<TH>Type</TH>
<TH>Numero de série</TH>
</TR>
<TR>
<TD>Peugeot 106</TD>
<TD>B2</TD>
<TD ALIGN=MIDDLE>234.34</TD>
<TD>132</TD>
<TD>5,7</TD>
</TR>
<TR>
<TD>Citroën AX</TD>
<TD>AT67B8</TD>
<TD ALIGN=MIDDLE>6789</TD>
<TD>126</TD>
<TD>5,5</TD>
</TR>
</TABLE>
</CENTER>

Comparatif modèle économique
| Modèle
| Vitesse en km/heure
| Consommation en litre/100 km
|
| Marque |
Type |
Numero de série |
| Peugeot 106 |
B2 |
234.34 |
132 |
5,7 |
| Citroën AX |
AT67B8 |
6789 |
126 |
5,5 |