Le codage HTML

Formatage d'un tableau

Définir un tableau

Les attributs :

border=

formate la taille du cadre

bordercolor=

formate la couleur du cadre

cellspacing=

formate l'espacement entre les cellules

cellpadding=

formate les marges intérieures

width=

formate la largeur des cellules du tableau

bgcolor=

formate la couleur de fond du tableau

background=

formate le fond du tableau avec une image (comme pour le <body>)

Formater une ligne

Les attributs :

align=

formate l'alignement horizontal

valign=

formate l'alignement vertical

Formater une colonne

Les attributs :

align=

formate l'alignement horizontal

valign=

formate l'alignement vertical

colspan=

fusionne sur une même ligne le nombre de cellules indiquées

rowspan=

fusionne sur une même colonne le nombre de cellules indiquées

width=

formate la largeur des cellules du tableau

bgcolor=

formate la couleur de fond d'une cellule d'un tableau

Exemple de tableaux

Un tableau simple :

<table cellspacing="0" cellpadding="0" border="1" bgcolor="green" bordercolor="blue" width="80%" align="center">
<tr>
<td width="20%" bgcolor="red">1</td>
<td width="80%" bgcolor="lime">2</td>
</tr>
<tr>
<td width="20%" bgcolor="gray">3</td>
<td width="80%">4</td>
</tr>
</table>

1

2

3

4


 

Un tableau avec une ligne de cellules fusionnées :

<table cellspacing="0" cellpadding="0" border="1" bgcolor="green" bordercolor="blue" width="80%" align="center">
<tr>
<td width="100%" bgcolor="red" colspan="2">1</td>
</tr>
<tr>
<td width="20%" bgcolor="gray">3</td>
<td width="80%">4</td>
</tr>
</table>

1

3

4


 

Un tableau avec une colonne de cellules fusionnées :

<table cellspacing="0" cellpadding="0" border="1" bgcolor="green" bordercolor="blue" width="80%" align="center">
<tr>
<td width="20%" bgcolor="red" rowspan="2">1</td>
<td width="80%" bgcolor="lime">2</td>
</tr>
<tr>
<td width="80%">4</td>
</tr>
</table>

1

2

4

[Sommaire] [Structurer une page] [Formater un paragraphe] [Formater un texte] [Formater une police de caractère] [Insérer une image] [Insérer un lien (vers une autre page, vers un autre site, vers un email...)] [Insérer une ligne]