Attributs |
Utilisation |
Valeurs possibles |
Exemple |
color |
Définit la couleur d'avant-plan pour le texte de l'élément
Cette couleur peut être définie à l'aide d'un nom, d'un triplet décimal ou hexadécimal |
- nom de couleur : red, yellow, etc...
- triplet décimal : rgb(0,255,255)
- triplet hexadécimal : #00FF00
|
BLOCKQUOTE { color: red }
P { color: rgb(0,255,255) }
H1 { color: #00FFFF } |
background-color |
Définit la couleur de fond pour un élément indépendamment de la couleur de fond du document
entier |
Voir ci-dessus |
DIV { background-color: blue } |
background-image |
Spécifie une image de fond pour un élément |
Conseil : à utiliser avec background-color pour assurer le remplacement
en cas d'indisponibilité de l'image
|
SPAN { background-image : url(logo.gif) } |
background-repeat |
Définit la façon de répéter l'image de fond (en mosaïque) |
- repeat (répétition dans les deux sens)
- repeat-x (répétition horizontale)
- repeat-y (répétition verticale
- no-repeat (pas de répétition)
|
BODY { background-image: url(logo.gif); background-repeat: repeat-x } |
background-attachment |
Spécifie si l'image de fond est attachée au texte de premier plan ou si elle est fixée sur
le fond.
Cette fonctionnalité n'est décelable que lorsque l'utilisateur effectue un scroll
vertical. |
|
BLOCKQUOTE { background-image: url(logo.gif); background-attachment: fixed } |
background-position
|
Permet de spécifier la position de départ de l'image de fond |
- positionnement vertical :
top|center|bottom
- positionnement horizontal:
left|center|right
- positionnement en pourcentage :
0%0% (coin supérieur gauche) à 100%100% (coin inférieur droit)
- positionnement en valeur absolue :
2cm 5cm (en centimètres ou en pouces): à 2 cm du bord gauche et à 5 cm du bord
supérieur de l'écran
|
BLOCKQUOTE { background-image: url(logo.gif); background-repeat: repat-y;
background-position: right top } |
background |
Permet de spécifier tous les attributs précédents en une seule fois |
L'ordre de spécification doit être background-color, background-image, background-repeat,
background-attachment, bakground-position
|
P { background : black url(logo.gif) repeat-y fixed left top } |