Un tableau est défini par les balises <TABLE> et </TABLE>. À la première balise, vous pouvez ajouter des commandes qui définissent les caractéristiques générales du tableau.
BORDER= | Pour définir l'épaisseur des bordures, en pixels. Une bordure de 0 pixel est invisible |
CELLSPACING= | Pour définir la largeur de la gouttière (en pixels), bordure intérieure qui sépare les cellules |
CELLPADDING= | Pour définir une marge dans les cellules, pour éviter que le contenu des cellules s'affiche trop près des bordures |
WIDTH= | Pour définir la largeur du tableau, en pixels ou en pourcentage de la largeur de la fenêtre du visualiseur |
Par exemple, les balises suivantes définissent un tableau avec une gouttière de 5 pixels, une largeur totale de 200 pixels et une bordure extérieure de 4 pixels.
Un tableau peut avoir un titre, à définir entre les balises <CAPTION> et </CAPTION>. Le titre apparaît au-dessus de tableau, centré. Pour placer le titre sous le tableau, utilisez la commande ALIGN=BOTTOM dans la balise <CAPTION>.
Le langage HTML fait la distinction entre la ligne des en-têtes de colonnes (table header) et les lignes de données (table data).
<TH> </TH> | Balises d'en-tête. Le texte apparaît en gras et centré au milieu de la cellule, horizontalement et verticalement. Chaque couple de balises correspond à une cellule d'en-tête de ligne ou de colonne. |
<TD> </TD> | Balises de données. Le texte est aligné à gauche, et est placé en haut de la cellule. Mais divers paramètres d'alignement permettent de modifier cette présentation. Chaque couple de balises correspond à une cellule de données. |
ALIGN=LEFT ALIGN=CENTER ALIGN=RIGHT |
Alignement horizontal (gauche, centré, droite). |
VALIGN=TOP VALIGN=MIDDLE VALIGN=BOTTOM |
Alignement vertical dans la cellule (en haut, centré, en bas). |
Alignement par défaut pour le texte de cette cellule. Première cellule. |
Deuxième cellule de la première ligne. Cette cellule contient plusieurs paragraphes de texte. La disposition de ce texte est standard. |
Troisième cellule du tableau, première cellule de la seconde ligne. Le texte est centré et aligné en haut de la cellule. |
Alignement à droite pour cette quatrième cellule. |
<TABLE CELLSPACING=10 BORDER=1 WIDTH=100%>
<CAPTION ALIGN=BOTTOM>Titre du tableau</CAPTION>
<TR>
<TD>
Alignement par défaut pour le texte de cette cellule. Première cellule.
</TD>
<TD>
Deuxième cellule de la première ligne.<P>
Cette cellule contient plusieurs paragraphes de texte.<P>
La disposition de ce texte est standard.
</TD>
</TR>
<TR>
<TD ALIGN=CENTER VALIGN=TOP>
Troisième cellule du tableau, première cellule de la seconde ligne.
Le texte est centré et aligné en haut de la cellule.
</TD>
<TD ALIGN=RIGHT>
Alignement à droite pour cette quatrième cellule.
</TD>
</TR>
</TABLE>
</BODY>
<HTML>
Cet exemple étant peu élégant, voici un autre tableau :
Dim | Lun | Mar | Mer | Jeu | Ven | Sam |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | ![]() |
Ce calendrier introduit la section suivante, qui explique comment fusionner des cellules.
Ces commandes permettent d'indiquer combien de cellules vous souhaitez fusionner dans la ligne (ROWSPAN) ou la colonne (COLSPAN).
Un exemple simple :
Préparation des repas | ||||
---|---|---|---|---|
Matin | Midi | Goûter | Soir | |
Salles 1 et 2 | Lucette | Alexandra et Emmanuelle | Yvonne | Paule |
Paule | Yvonne et Chantal | Lucette | ||
Salles 3 et 4 | Chantal | Paule | Yvonne | |
Paule | Yvonne | Chantal | Alexandra |
La commande BORDERCOLOR=, ajoutée à la balise de définition du tableau, permet de définir une couleur de bordure.
La valeur à indiquer correspond aux trois chiffres hexadécimaux rouge, vert et bleu utilisés pour définir le fond de page Web. Par exemple, <TABLE BGCOLOR="#COCOCO" bordercolor="#FFFFFF" BORDER=1> appliquera un fond gris et une bordure blanche au tableau.
Le visualiseur de Microsoft permet de définir d'autres paramètres, qui ne sont pas encore affichés par tous les visualiseurs. Mais les autres produits ne sont pas sans qualités. Certains permettent d'afficher une image comme fond du tableau.
Il ne fait pas de doute que certaines de ces commandes s'imposeront.
Si vous ne voulez pas que le texte passe automatiquement à la ligne dans une cellule, ajoutez la commande NOWRAP à la balise <TD>.
La diffusion de ce document sur Internet ou des serveurs BBS est autorisée, à condition qu'il le soit dans son intégralité et sans aucune modification. La diffusion sur des services en lignes commerciaux doit faire l'objet d'une autorisation de la part de l'auteur.
Les marques citées sont déposées par leurs propriétaires respectifs.
L'auteur dégage toute responsabilité en cas de dommages directs, indirects, accidentels ou consécutifs provenant d'informations erronées, et ce, même si l'auteur a été prévenu de la possibilité de tels dommages.
![]() |
![]() |