|
|
cours et tutoriaux : les tableaux |
FONCTIONS
- Présenter des données tabulaires
- Mieux contrôler la mise en page Html (réalisation
de "gabarit")
- Réaliser des mises en formes complexes (images imbriqués)
La mise en page à l'aide de tableaux demeure
complexe (notamment lorsqu'il s'agit d'imbriquer des images et
du textes) car les navigateurs n'interprètent pas de la
même manière les tags relatifs aux tableaux.
BALISES PRINCIPALES (HTML 3.2)
<TABLE>
déclare l'ouverture d'un tableau
<TH>
définit l'entête d'un tableau
<TR>
marque la fin d'une ligne
<TD>
définit le contenu d'une cellule.
Exemple :
<TABLE>
<TR><TD>blabla</TD> <TD>blabla</TD></TR>
<TR><TD>blabla</TD> <TD>blabla</TD></TR>
<TR><TD>blabla</TD> <TD>blabla</TD></TR>
</TABLE>
ATTRIBUTS PRINCIPAUX
Elément Table
Largeur du tableau : WIDTH
Exemple : <TABLE width="590"> ou <TABLE width="80%">
(le tableau occupera alors 80% de la fenêtre du navigateur)
Bordure du tableau : BORDER
<TABLE border="0"> (tableau invisible). Cette
astuce est couramment utilisée pour contrôler la
mise en forme d'une page web.
Espace entre les cellules <TABLE cellspacing="5"
>
Remplissage des cellules <TABLE cellpading="5"
>
Couleur d'arrière plan du tableau :
<TABLE bgcolor="#FFFF33">
Attributs des rangées (TR) et cellules (TD) :
<TR bgcolor="#004080"> : Couleur d'une rangée
<TD bgcolor="#004080"> : Couleur d'une cellule
<TD width="250"> ou <TD width="20%"
: Taille d'une cellule
Autres Propriétés :
<ROWSPAN> : définit la hauteur des lignes (fusion
de rangées)
<COLSPAN> : définit la largeur des colonnes (fusion
de colonnes)
Alignement d'un ou plusieurs ou tableaux :
Je vous conseille d'utiliser plutôt la balise <DIV align="center
ou right ou left> plutôt que la balise <TABLE align="center">
(non compatible avec Netscape 3).
|
