KIT GRAPHIQUE - Télécharger des kits graphiques

Les tables en html permettent de présenter simplement et facilement une suite d'éléments dans un ordre définit

Les balises

Les principales balises sont:
<TABLE> et >/TABLE> pour l'ouverture et la fermeture de la table.
<TR> et </TR> pour l'ouverture et la fermeture d'une rangée.
<TD> et </TD>pour l'ouverture et la fermeture d'une cellule. Les cellules peuvent contenir du texte, des chiffres, des images, des liens et même d'autres tables.
<table><tr><td> et </td></tr></table> sont utilisés dans cet ordre.

Exemples

Table a 4 cellules identiques
l'attribut BORDER definit une bordure, il exprimé en pixels:
<table border="1">
<tr><td>1</td><td>2</td></tr>
<tr><td>3</td><td>4</td></tr>
</table>

L'attribut CELLSPACING permet d'incérer un espace entre les cellules , il est exprimé en pixels

L'attribut CELLPADDING permet d'incérer un espace à l'interieur des cellules , il est exprimé en pixels

Les cellules

La grandeur des cellules se règle par défaut, on doit souvent indiquer la largeur surtout si les élément des cellules ne sont de grandeur identique.
L'attribut Width est utilisé, sa valeur s'exprime en pixels ou en pourcentage.

Prenons un exemple:
<table border="1" widthg="60%">
<tr><td >Grande cellule </td>
<td >cellule</td>
<td>3</td>
</tr></table>
ce qui donne

Avec width:
<table border="1" widthg="60%" >
<tr><td width="33% >Grande cellule </td>
<td width="33% >cellule</td>
<td width="34%">3</td>
</tr></table>
cela donne

Dans une colonne les cellules auront toutes la même largeur, même si elle est précisée qu'une fois .
Exemple:
<table border="1" widthg="60%" >
<tr><td width="35%">Grande cellule </td>
<td width="35%">cellule</td>
<td width="30%">3</td>
</tr><tr><td >Grande cellule </td>
<td >cellule</td>
<td>3</td>
</tr></table>
cela donne

L'attribut COLSPAN permet de fusionner les cellules horizontalement, sa valeur est un chiffre qui indique le monbre de cellules à fusionner:
exemple:
<table border="1" width="60%" >
<tr><td width="35%">Grande cellule </td>
<td colspan="2" >cellule</td>
</tr><tr><td width="35%">Grande cellule </td>
<td width="35%">cellule</td>
<td>3</td>
</tr></table>
cela donne

L'attribut ROWSPAN permet de fusionner les cellules verticalement sa valeur est un chiffre qui indique le monbre de cellules à fusionner:
exemple:
<table border="1" widthg="60%" >
<tr><td width="35%" rowspan="2">Grande cellule </td>
<td colspan="2">cellule</td>
</tr><tr>
<td width="35%">cellule</td>
<td>3</td>
</tr></table>