SI4 TP Devoir.pmd

SI4 - Base de la Programmation
TP SI4 N°3 : Les Tableaux V2 en XHTML
Objectif : Créer des tableaux plus complexes en XHTML.
1- Pour dimensionner :
Un tableau mettre les attributs dans le marqueur : <table width="..." height="..." >
Une cellule mettre les attributs dans le marqueur : <td width="..." height="...">
Dimensions relatives : (avec «%»)
Voici un tableau qui occupe 75% de l’objet qui le contient :
<table width="75%" height="10%" >
Dimensions absolues : (sans «%»)
Voici un tableau qui occupe 400 pixels
<table width="400" height="10" >
TP : Tester dans un navigateur les dimensions d'un tableau
2 - Les couleurs :
Fond et quadrillage : <table border bgcolor="yellow" bordercolor="green" >
Pour une cellule seulement : dans le tag cellule <td bgcolor="yellow">Contenu cellule</td>
Ombrages : <table border bodercolordark="green" bordercolorlight="yellow" >
TP : Tester dans un navigateur les couleurs d'un tableau
3 - Alignement :
Pour disposer le texte dans sa cellule :
<td align="center"> Centre le texte horizontalement dans la cellule.
<td align="right"> Aligne le texte à droite.
<td align="right" valign="bottom"> Aligne le texte à droite et en bas.
Les valeurs pour ALIGN sont : "LEFT" (par défaut), "CENTER", "RIGHT"
Les valeurs pour VALIGN sont : "TOP", "MIDDLE" (par défaut), "BOTTOM"
TP : Tester dans un navigateur les alignements d'une cellule d'un tableau
S. T. S. - SIO Première année
page 8
SI4 - Base de la Programmation
TP SI4 N°3 : Les Tableaux V2 en XHTML
4 - Fusion de cellules :
Sachez que plus un tableau comporte des cellules fusionnées, plus il y a des risques que le navigateur
l’interprète mal. Pour éviter ce problème, il faut mieux insère des tableaux dans la cellule.
Pour la fusion verticale :
Pour la fusion de cellule verticale, faut utiliser l’attribut ROWSPAN de la balise <TD>, dont la valeur
est égale au nombre de cellules fusionnées.
On l’écrit : <TD ROWSPAN="2"> pour deux cellules fusionnés.
Pour la fusion horizontale :
Pour la fusion de cellule horizontale, faut utiliser l’attribut COLSPAN de la balise <TD>, dont la valeur
est égale au nombre de cellules fusionnées.
On l’écrit : <TD COLSPAN="2"> pour deux cellules fusionnés.
TP : Tester dans un navigateur les fusions de cellules d'un tableau.
5 - Exercice - Faire le tableau suivant :
S. T. S. - SIO Première année
page 9

Download Report