Développement HTML :
Les tableaux
|
HTML permet de réaliser des tableau avec réglage de l'encadrement, de la taille et de l'éspacement des cellules.La définition de la structure d'un tableau est tout à fait comparable à celle des listes.On définit une balise indique la balise de fin de tableau.
Un tableau se définit entre les balises <TABLE> et </TABLE>.Al'interieur de la premiere balise, on règle la présentation générale du tableau àl'aide de quatre attribut:
- L'attribut BORDER:Définit l'épaisseur du cadre exterieur.
- L'attribut CELLSPACING:Définit l'éspace entre les cellules.
- L'attribut WIDTH:Définit la largeur du tableau relativement à la largeur de la fenêtre du navigateur.
Le tableau est ensuite décrit ligne par ligne.
L'élément définissant une nouvelle ligne est TR qui admet les attributs d'alignement du texte à l'interieur de toutes les cellules de la ligne.
- L'attribut VALIGN(alignement vertical): Peut prendre les valeurs suiventes:
- VALIGN=TOP:Place le texte en haut de la cellule.
- VALIGN=BOTTOM:Place le texte en bas de la cellule.
- L'attribut ALIGN(alignement horizontale): Peut prendre les valeurs suiventes:
- ALIGN=RIGHT : Place le texte à droite de la cellule.
- ALIGN=LEFT : Place le texte à gauche de la cellule.
- ALIGN=CENTER: Centre le texte dans la cellule.
- La balise </TR> termine la définition d'une ligne.
- Pour définir une colonne, on utilise la balise <TR>. Elle peut être compléte par les attributs VALIGN et ALIGN qui seront alors prioritaires sur la balise <TR>.
- La balise <TH> est une balise fonctionnant de façon similaire à la balise <TD>. Elle admet les mêmes attributs mais elle est considérée comme balise de titre d' une cellule.Le centrage du texte et l'utilisation des caractères gras sont automatiques.
- On peut affecter une couleur à un tableau une ligne ou une collone à l'aide de l'attribut BGCOLOR.
Exemple:
<TABLE BORDER="2"CELLPADDING="3"BORDERCOLOR="#0000FF">
<TR>
<TD>cellule1</TD>
<TD>cellule2</TD>
<TD>cellule3</TD>
</TR>
<TR>
<TD>cellule4</TD>
<TD>cellule5</TD>
<TD>cellule6</TD>
</TR>
</TABLE>.
Les étapes à suivre sous Web Expert:
- Dans l'onglet"Tableau, cadre et listes" cliquer sur le bouton
 "inserer un tableau".
- Indiquer le nombre de colonnes et de rangées de votre tableau.
- Lorsque vous saisissez le nombre de ligne et de colonne du tableau, la fenêtre"tableau"apparaitra. Dans celle-ci, vous pourrez indiquer les propriétés (largeur et hauteur des cellules, couleurs, bordures...)de votre tableau.Vous pourrez aussi inscrire directement votre texte dans chacune des cellules.
- Pour définir les propriétés additionnelles du tableau:
- Lors de la création de votre tableau, ciquez sur le bouton droit de la souris pour avoir le menu contextuel:
- Au niveau de menu contextuel,sélectionner "propriétés additionnelles du tableau".
- Dans la fenêtre"propriété du tableau",cliquez sur l'onglet "Avancée".
- Définir les propriétés du tableau:"Image d'arrière-plan", "Bordures externes", "Couleurs de bordure"et"Bordures interne".
NB:Les bordures externes et internes, peuvent être présentes comme elles peuvent être omises.
- Pour définir les propriétés additionnelles d'une cellule:
- Se positionner sur la cellule à modifier.
- Cliquez sur le bouton droit de la souris pour avoir le menu contextuel.
- Sélectionnez"Propriétés de la cellule".
- La fenêtre"Propriétés de la cellule"s'affiche, vous pouvez alors définir(Au niveau de l'onglet"Général")l'alignement horisental, vertical de la cellule,la couleur de l'arrière plan, largeur, hauteur, couleur de la bordure(balise spécifique à IE).
|
|
|
