Les tableaux sont indispensables pour structurer une page. La plupart du temps, ils sont invisibles mais permettent de placer les images et le texte avec plus de précision dans la surface de la page.
Le tableau est contenu dans les balises <TABLE></TABLE>. Il est formé de rangs et de colonnes.
Les rangs sont créés à l’aide des balises <TR> et les colonnes, avec des balises <TD> :
<TABLE><TR><TD></TD><TD></TD></TR> </TABLE>
Ici, vous avez une table d’un rang et de deux colonnes. Sur un des rangs, vous pouvez fusionner les deux colonnes. Pour cela, utilisez un attribut <TD COLSPAN="2"> :
<TABLE><TR><TD></TD><TD></TD></TR><TR><TD COLSPAN="2"></TD</TR></TABLE>.
Vous pouvez aussi faire la transformation sur deux cellules dans une même colonne, sur deux lignes adjacentes :
<TABLE><TR><TD ROWSPAN="2"></TD><TD></TD></TR><TR><TD></TD></TR></TABLE>
Pour voir l’effet de votre code dans la fenêtre du navigateur, nous vous conseillons d’ajouter border="1" dans la balise table <TABLE border="1">, le temps de faire le test. Ainsi, vous marquerez les limites de vos cellules de tableau avec une bordure. Exercez-vous. Tapez du code dans un traitement de texte comme Notepad (ou Bloc-notes) dans les accessoires de Windows ou Simpletext, dans le menu Pomme du
Macintosh. Ensuite, nommez-le index.htm ou index.html et ouvrez-le dans votre navigateur. Vous touchez à la dimension magique de simples mots qui créent instantanément un univers visuel à l’écran.
Pour placer des éléments dans votre page au moyen d’un tableau invisible, il faut en calibrer la largeur. La taille de chaque colonne devra être précisée car autrement, le tableau adaptera chaque colonne au contenu de ses cellules, réduisant à rien les colonnes vides. Une colonne vide devra contenir un espace insécable pour que la taille puisse être prise en compte. La taille est déclarée soit par un nombre de pixels, soit par un pourcentage. L’intérêt d’utiliser le pourcentage, au moins pour le tableau complet, est que l’écran de vos visiteurs peut afficher des définitions différentes (640 pixels par 480, 1024 x 768 ou 1280 x 1024) et qu’une page structurée par un tableau déterminé en pourcentage s’adaptera à chaque configuration. Le pourcentage est une valeur relative à la taille tandis que le pixel est une valeur absolue.
<TABLE width="95%">. Ici, le tableau occupera tout l’écran ou presque, quelle que soit la taille de l’écran. Vous pouvez aussi colorer le fond de ce tableau avec bgcolor="#FF00CC" en le positionnant dans la balise table, tr ou td, selon la surface que vous souhaitez colorer.
Le tableau est contenu dans les balises <TABLE></TABLE>. Il est formé de rangs et de colonnes.
Les rangs sont créés à l’aide des balises <TR> et les colonnes, avec des balises <TD> :
<TABLE><TR><TD></TD><TD></TD></TR> </TABLE>
Ici, vous avez une table d’un rang et de deux colonnes. Sur un des rangs, vous pouvez fusionner les deux colonnes. Pour cela, utilisez un attribut <TD COLSPAN="2"> :
<TABLE><TR><TD></TD><TD></TD></TR><TR><TD COLSPAN="2"></TD</TR></TABLE>.
Vous pouvez aussi faire la transformation sur deux cellules dans une même colonne, sur deux lignes adjacentes :
<TABLE><TR><TD ROWSPAN="2"></TD><TD></TD></TR><TR><TD></TD></TR></TABLE>
Pour voir l’effet de votre code dans la fenêtre du navigateur, nous vous conseillons d’ajouter border="1" dans la balise table <TABLE border="1">, le temps de faire le test. Ainsi, vous marquerez les limites de vos cellules de tableau avec une bordure. Exercez-vous. Tapez du code dans un traitement de texte comme Notepad (ou Bloc-notes) dans les accessoires de Windows ou Simpletext, dans le menu Pomme du
Macintosh. Ensuite, nommez-le index.htm ou index.html et ouvrez-le dans votre navigateur. Vous touchez à la dimension magique de simples mots qui créent instantanément un univers visuel à l’écran.
Pour placer des éléments dans votre page au moyen d’un tableau invisible, il faut en calibrer la largeur. La taille de chaque colonne devra être précisée car autrement, le tableau adaptera chaque colonne au contenu de ses cellules, réduisant à rien les colonnes vides. Une colonne vide devra contenir un espace insécable pour que la taille puisse être prise en compte. La taille est déclarée soit par un nombre de pixels, soit par un pourcentage. L’intérêt d’utiliser le pourcentage, au moins pour le tableau complet, est que l’écran de vos visiteurs peut afficher des définitions différentes (640 pixels par 480, 1024 x 768 ou 1280 x 1024) et qu’une page structurée par un tableau déterminé en pourcentage s’adaptera à chaque configuration. Le pourcentage est une valeur relative à la taille tandis que le pixel est une valeur absolue.
<TABLE width="95%">. Ici, le tableau occupera tout l’écran ou presque, quelle que soit la taille de l’écran. Vous pouvez aussi colorer le fond de ce tableau avec bgcolor="#FF00CC" en le positionnant dans la balise table, tr ou td, selon la surface que vous souhaitez colorer.
 |
| Tableau invisible avec fond |
 |
| Tableau visible avec bordures |
Aucun commentaire:
Enregistrer un commentaire