Les balises :: Gestion des tableaux

Utilisation de tableaux

On a souvent besoin de présenter des informations mieux structurées qu'avec des listes. Les tableaux permettent de les afficher en lignes et en colonnes.

Les tableaux sont définis comme étant des suites de lignes.


Le tableau est encadré par les balises <table> et </table>.
Le titre du tableau est encadré par <caption> </caption>
Chaque ligne est encadrée par <tr> </tr> (table Row, traduisez par ligne du tableau).
Les cellules d'en-tête sont encadrées par <th> </th> (pour table header : En-tête de tableau)
Les cellules de valeur sont encadrées par <td> </td> (table Data: Donnée de tableau)

Par exemple le tableau:

<table border="1">         
  <caption> Voici le titre du tableau </caption>        
  <tr>       
    <th> Titre A1 </th> 
    <th> Titre A2 </th> 
    <th> Titre A3 </th> 
    <th> Titre A4 </th> 
  </tr>       
  <tr>       
    <th> Titre B1 </th> 
    <td> Valeur B2 </td> 
    <td> Valeur B3 </td> 
    <td> Valeur B4 </td> 
  </tr>       
</table> 

donne le résultat suivant:

Voici le titre du tableau
Titre A1 Titre A2 Titre A3 Titre A4
Titre B1 Valeur B2 Valeur B3 Valeur B4

vers le haut

Les attributs

Attribut Balises auxquelles il s'applique Valeur Effet Visuel
align thead
tbody
th
tr
td
center
left
right
justify
centré
gauche
droite
justifié
caption top
bottom
au-dessus
en-dessous
Valign
(alignement vertical)
thead
tbody
th
tr
td
top
middle
bottom
en haut
au milieu
en bas
border=n table   taille ou épaisseur de la bordure
cellpadding=n table   espacement de n pixels entre le contenu des cellules et son encadrement ou marge interieur des cellules
cellspacing=n table   Epaisseur de la grille intérieure ou espace entre deux cellules
float table right
left
Spécifie la position du texte qui suivra
</table>
cols=n table   Spécifie le nombre de colonnes
frame
(contrôle les éléments
individuels d'encadrement
du tableau)
table none
top
bottom
topbot
sides
all
aucun
au-dessus
en bas
tout en haut
sur les cotés
tous
rules
(contrôle les éléments
de la grille des cellules)
table none
basic
rows
cols
all
aucun
basique
ligne
colonne
tous
colspan thead
tbody
th
tr
td
  Fait déborder les cellules sur les colonnes
adjacentes
rowspan thead
tbody
th
tr
td
  Fait déborder les cellules sur les lignes
adjacentes

 

Deux petits expemples utilisants les attrbuts "colspan" et "rowspan" :

2005
Semestre 1 Semestre 2
trimestre 1 trimestre 2 trimestre 3 trimestre 4
J F M A M J J A S O N D

 

2005 semestre 1 trimestre 1 Janvier
Fervier
Mars
trimestre 2 Avril
Mai
Juin
semestre 2 trimestre 3 Juillet
Aout
Septembre
trimestre 4 Octobre
novembre
Decembre

 


vers le haut

exemple de tableau

     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     


     
     
     

Association 1 Association 2 Association 3
concernées:
55 Mio. individus
concernées:
4 Mio. individus
concernées:
1,5 Mio. individus
France Belgique Suisse
serpillière wassingue panosse
quatre-vingts octante huitante