- Introduction
- Le fond d'écran
- Le texte
- Les liens
- Code des couleurs
- Les marges
- Les marges
- Colorier les barres de défilements
Le conteneur <BODY> marque le contenu de la page à afficher :
texte, images... C'est en propriété à <BODY> qu'on peut aussi décider l'affichage d'une boite de dialogue
Alert (JavaScript) lors du chargement de la page et avant son affichage. Les proprétés de corps du document s'appliquent à
l'intégralité de la page web. Toutes les proriétés qui vont suivre sont facultatives.
On a le choix entre une couleur de fond et une image en mozaïque.
Couleur de fond
La couleur de fond est spécifiée en son format en hexadécimal ou par son nom comme valeur à
la propriété BGCOLOR. Par défaut, une page est de fond blanc.
Exemples :
<BODY BGCOLOR="purple">
</BODY>
<BODY BGCOLOR="#800080">
</BODY>
Image de fond
L'image de fond est spécifiée par son adresse relative ou absolue comme valeur à
la propriété BACKGROUND.
Exemples :
<BODY BACKGROUND="../images/fond.gif">
</BODY>
<BODY BACKGROUND="http://www.multimania.com/cyberzoide/images/fond.gif">
</BODY>
La couleur du texte par défaut est spécifiée par le navigateur (en général, c'est le noir),
mais il est possible d'imposer une couleur pour le texte de la page par l'attribut TEXT dont la valeur
est le nom de la couleur ou sa valeur au format hexadécimal. Lorsque vous spécifiez une couleur ou une image de fond,
il vous sera souvent nécessaire d'imposer une couleur spécifique pour que votre page soit lisible.
Exemples :
<BODY TEXT="black">
</BODY>
<BODY TEXT="#000000">
</BODY>
Les couleurs des liens (texte, soulignement et bordure d'image) sont définies pour
toute la page dans la balise <BODY>. Si cette dernière ne contient pas d'information relative
aux liens, alors les paramètres par défaut du navigateur (qui peuvent êtres modifiés par l'utilisateur) s'appliquerons.
Ainsi il est fortement recommandé de préciser les couleurs des liens dès lors qu'une couleur ou une image de fond
est associée à une page.
Liens
La couleur des liens qui n'ont pas encore été visités et qui ne sont pas activés par la souris
ou le focus est définie par la propriété LINK dont la valeur est le nom de la couleur ou son code
hexadécimal (précédé d'un dièse).
Exemples :
<BODY LINK="navy">
</BODY>
<BODY LINK="#000080">
</BODY>
Liens déjà visités
La couleur des liens qui ont déjà été visités est définie par la propriété VLINK
dont la valeur est le nom de la couleur ou son code hexadécimal (précédé d'un dièse).
Exemples :
<BODY VLINK="gray">
</BODY>
<BODY VLINK="#808080">
</BODY>
Liens activés
La couleur des liens qui sont activés (lors du click de souris ou de la pression de la touche
ENTRÉE) est définie par la propriété ALINK
dont la valeur est le nom de la couleur ou son code hexadécimal (précédé d'un dièse).
Exemples :
<BODY ALINK="red">
</BODY>
<BODY ALINK="#FF0000">
</BODY>
<BODY LINK="navy"
VLINK="gray"
ALINK="red">
</BODY>
Par défaut, le navigateur affiche (et souligne) en bleu
les liens non visités, en pourpre les liens déja visités et en
rouge les liens activés.
Voici le code des 16 couleurs principales du HTML 3.2.
| Nom | Code | Résultat |
|---|
| Black | #000000 | |
| Maroon | #800000 | |
| Green | #008000 | |
| Olive | #808000 | |
| Navy | #000080 | |
| Purple | #800080 | |
| Teal | #008080 | |
| Gray | #808080 | |
|
| Nom | Code | Résultat |
|---|
| White | #FFFFFF | |
| Red | #FF0000 | |
| Lime | #00FF00 | |
| Yellow | #FFFF00 | |
| Blue | #0000FF | |
| Fuchsia | #FF00FF | |
| Aqua | #00FFFF | |
| Silver | #C0C0C0 | |
|
On peux spécifier des tailles de marge (haut, bas, gauche, droit).
Pour la marge du haut : TOPMARGIN, pour celle du bas : BOTTOMMARGIN,
pour celle de gauche : LEFTMARGIN, pour celle de droite : RIGHTMARGIN.
Exemple :
<BODY TOPMARGIN="50" BOTTOMMARGIN="50" LEFTMARGIN="40"
RIGHTMARGIN="40" >
</BODY>
On peux spécifier des tailles de marge (haut et bas en même temps : MARGINWIDTH et gauche/doite :
MARGINHEIGHT).
Pour les marges des côtés gauche et droit : MARGINWIDTH et pour les marges du haut et du bas : MARGINHEIGHT.
Exemple :
<BODY MARGINWIDTH="40" MARGINHEIGHT="50" >
</BODY>
Les couleurs des barres de défilement (scrollbar en anglais) horizontales et verticales (appelées aussi ascenseurs)
peuvent être redéfinies.
| Propriété | Description |
|---|
| scrollbar-base-color | couleur générale de la barre, les autres couleurs étant calculée à partir de celle-ci |
| scrollbar-face-color | couleur de face de la barre de défilement |
| scrollbar-arrow-color | couleur des fleches de navigation |
| scrollbar-track-color | couleur de l'arrière plan |
| scrollbar-darkshadow-color | couleur de l'effet 3D du côté sombre de la barre |
| scrollbar-3dlight-color | couleur de l'effet 3D du côté éclairé de la barre |
| scrollbar-highlight-color | couleur du bord éclairé |
| scrollbar-shadow-color | couleur du bord sombre |
Exemples de feuille de style :
body {
scrollbar-face-color: navy;
scrollbar-arrow-color: blue;
scrollbar-track-color: pink;
scrollbar-3dlight-color: silver;
scrollbar-darkshadow-color: dark;
scrollbar-shadow-color : red;
scrollbar-highlight-color: color;
}
body {
scrollbar-base-color: read;
}
| 
