10. Tableaux

<TABLE></TABLE>: Commande principale.
<TR></TR>: Commande qui définit une rangée.
<TH></TH>: Commande qui définit une cellule du tableau.
WIDTH: Commande qui vous permet de varier la largeur du tableau.
<TABLE BORDER=1, 2, 3, ..., 10, ...>: Commande vous permettant de définir la taille de la bordure du tableau.

Nous verrons d'autres commandes au fur et à mesure qu'on donnera des exemples.

a. Tableau sans bordure

<TABLE>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



b. Bordure du tableau BORDER

<TABLE BORDER=5>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



c. Largeur du tableau WIDTH

<TABLE BORDER=5 WIDTH="80%">
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



d. Espacement entre cellules CELLSPACING

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



e. Largeur d'une cellule CELLPADDING

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



f. La commande NOWRAP

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8 et autre que vous désirez</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8 et autre que vous désirez



La commande NOWRAP remédie à ceci.

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH NOWRAP>cellule8 et autre que vous désirez</TH NOWRAP></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8 et autre que vous désirez



g. La commande COLSPAN

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TD COLSPAN=4>commande COLSPAN</TD COLSPAN=4> <TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

commande COLSPAN
cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



h. La commande ROWSPAN

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TD ROWSPAN=3>commande ROWSPAN</TD ROWLSPAN=3> <TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH NOWRAP>cellule8</TH NOWRAP></TR>
</TABLE>

Résultat:

commande ROWSPAN
cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10>
<TD ROWSPAN=3>commande ROWSPAN</TD ROWLSPAN=3> <TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH NOWRAP>cellule8</TH NOWRAP></TR>
<TD COLSPAN=5>commande COLSPAN</TD COLSPAN=5>
</TABLE>

Résultat:

commande ROWSPAN
cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8
commande COLSPAN


Évidemment, vous pouvez inclure dans les tableaux des liens et des images.

i. La couleur dans les tableaux

Couleur uniforme dans tout le tableau

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10 BGCOLOR="#CCFF99">
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR><TH>cellule5</TH><TH>cellule6</TH><TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



Couleur dans une ligne du tableau

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10 BGCOLOR="#CCFF99">
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH>cellule4</TH></TR>
<TR BGCOLOR="#00FFFF"><TH>cellule5</TH><TH>cellule6</TH> <TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8



Couleur dans une cellule du tableau

<TABLE BORDER=5 WIDTH="80%" CELLSPACING=8 CELLPADDING=10 BGCOLOR="#CCFF99">
<TR><TH>cellule1</TH><TH>cellule2</TH><TH>cellule3</TH><TH BGCOLOR="#FFFF00">cellule4</TH></TR>
<TR BGCOLOR="#00FFFF"><TH>cellule5</TH><TH>cellule6</TH> <TH>cellule7</TH><TH>cellule8</TH></TR>
</TABLE>

Résultat:

cellule1cellule2cellule3cellule4
cellule5cellule6cellule7cellule8