Les tableaux Pour créer des tableaux, aïe ! Ça se corse... Mais non, ne soyez pas négatif dès le départ; en fait, un tableau se résumé à trois balises :<TABLE> pour la commande globale de définition du tableau, <TR> pour la définition des rangées et <TD> pour les colonnes.
Chacune de ces balises a sa balise de fermeture. Par ailleurs, ces trois balises s'imbriquent entre elles de la manière suivante :
1° Cas d'un tableau à 1 seule cellule :
Chacune de ces balises a sa balise de fermeture. Par ailleurs, ces trois balises s'imbriquent entre elles de la manière suivante :
1° Cas d'un tableau à 1 seule cellule :
<TABLE> <TR> <TD>contenu de la cellule</TD> </TR> </TABLE>
2° Cas d'un tableau à 2 cellules (sur 2 colonnes) :
<TABLE> <TR> <TD>contenu de la cellule 1</TD><TD>contenu de la cellule 2</TD> </TR> </TABLE>
3° Cas d'un tableau à 2 cellules (sur 2 rangées) :
<TABLE> <TR> <TD>contenu de la cellule 1</TD> <TR> </TR> <TD>contenu de la cellule 2</TD> </TR> </TABLE>
Voyons maintenant les sous-balises correspondant à chacune de ces balises :
<TABLE border="pixels" épaisseur de la bordure width="valeur" largeur du tableau cellspacing="valeur" espacement entre chaque cellule cellpadding="valeur"> espacement entre le contenu et les bords d'une cellule <TR align="left, center ou right"> alignement des données <TD rowspan="nombre" nombre de lignes couvertes par la cellule colspan="nombre"> nombre de colonnes couvertes par la cellule
Et voici la rédaction des deux exemples n° 20 et n° 21.
Exemple n° 20 (3 rangées de 3 colonnes) :
Exemple n° 20 (3 rangées de 3 colonnes) :
<TABLE border="1" width="100%" cellspacing="0" cellpadding="0"> <TR align="center"> <TD>cellule 1</TD><TD>cellule 2</TD><TD>cellule 3</TD> </TR> <TR align="center"> <TD>cellule 4</TD><TD>cellule 5</TD><TD>cellule 6</TD> </TR> <TR align="center"> <TD>cellule 7</TD><TD>cellule 8</TD><TD>cellule 9</TD> </TR> </TABLE>
<TABLE border="1" width="100%" cellspacing="0" cellpadding="0"> <TR align="center"> <TD>cellule 1</TD><TD rowspan="2">cellules<BR>2+5</TD><TD>cellule 3</TD> </TR> <TR align="center"> <TD>cellule 4</TD><TD>cellule 6</TD> </TR> <TR align="center"> <TD>cellule 7</TD><TD colspan="2">cellules 8+9</TD> </TR> </TABLE>
Exemple : page-21.htm
Vous aurez sans doute noté que les scripts que je vous propose ici sont présentés avec des indentations. Les blancs créés en tête de ligne, avant certaines balises, n'ont aucune incidence sur l'exécution du fichier HTML lui-même, mais permettent de bien visualiser les balises qui s'ouvrent et celles qui se ferment.
Vous aurez sans doute noté que les scripts que je vous propose ici sont présentés avec des indentations. Les blancs créés en tête de ligne, avant certaines balises, n'ont aucune incidence sur l'exécution du fichier HTML lui-même, mais permettent de bien visualiser les balises qui s'ouvrent et celles qui se ferment.
© 1999-2010 PhB - www.pictavie.net
