.: Comment faire des tableaux avec QuébecSpot! :.

Retourner au menu informatique et webmaster

Comment faire des tableaux
Balises et attributs de bases simples, pour les tableaux

<center> : sert à enligner le tableau ou la ligne au centre, left pour la gauche, et right pour la droite

<table> : qui indique au navigateur la création d'un tableau

<tr> : sert à créer une ligne dans le tableau

<td> : sert à créer une colonne dans le tableau

<cellpadding> : contrôle la largeur des cellules du tableau

<cellspacing> : contrôle la hauteur des cellulles du tableau

<colspan> : permet de fusionner 2 ou plusieurs cellules sur la même ligne

<rowspan> : permet de fusionner 2 ou plusieurs cellules sur la même colonne

<bgcolor> : permet d'ajouter une couleur au fond d'une cellule

<width> et <height> : contrôle la largeur et la hauteur du tableau dans la balise <table>

<bordercolor> : détermine la couleur de la bordure

<bordercolorlight> : donne un effet 3D à la bordure

<bordercolordark> : détermine la couleur de l'ombre de la bordure

Pour l'alignement des textes dans les cellulles, les attributs sont les mêmes utilisés pour les images.

Remarque : chaque balise se referme en se terminant avec un / avant l'attibut. (voir exemple dans les tableaux ci-dessous

Exemple de code:

<table border=1>
<tr>
<td>colonne 1</td>
<td>colonne 2</td>
</tr>
<tr>
<td>cellule 1</td>
<td>cellule 2</td>
</tr>
<tr>
<td>cellule 3</td>
<td>cellule 4</td>
</tr>
</table>

Résultat :

colonne 1	colonne 2
cellule 1	cellule 2
cellule 3	cellule 4

Autre exemple de code:

<center><table width="100" border="1" bgcolor="#FFFFFF" bordercolor="#990000" bordercolordark="#444444" cellpadding="2" cellspacing="3">
<tr>
<td bgcolor="#336699">colonne 1</td>
<td bgcolor="#336699">colonne 2</td>
</tr>
<tr>
<td bgcolor="#336699">cellule 1</td>
<td bgcolor="#336699">cellule 2</td>
</tr>
<tr>
<td bgcolor="#336699">cellule 3</td>
<td bgcolor="#336699">cellule 4</td>
</tr>
</table></center>

Résultat :

colonne 1	colonne 2
cellule 1	cellule 2
cellule 3	cellule 4

En partenariat avec

* Pour un meilleur rendement, certains éléments du site requiert que le contrôle "Active X" et le "Java script" soient activés dans votre navigateur