Attribut background-color CSS
- Page précédente background-clip
- Page suivante background-image
Définition et utilisation
background-color
Définit la couleur de fond de l'élément.
Portée de la couleur de fond de l'élément
background-color
Définir une couleur pure pour l'élément. Cette couleur remplira le contenu de l'élément, les marges internes et les bords, s'étendant à la limite externe de la bordure de l'élément (mais pas la marge externe). Si le bord a une partie transparente (comme un bord en pointillés), la couleur de fond apparaîtra à travers ces parties transparentes.
valeur transparent
Bien que dans la plupart des cas, il n'est pas nécessaire d'utiliser transparent
Cependant, si vous ne souhaitez pas que certain élément ait une couleur de fond et que vous ne souhaitez pas que les réglages de couleur de l'utilisateur affectent votre conception, définissez transparent
Les valeurs sont nécessaires.
Veuillez également consulter :
Tutoriel CSS :Arrière-plan CSS
Manuel de référence HTML DOM :Attribut backgroundColor
Exemple
Définir la couleur de fond pour différents éléments :
body { background-color:yellow; } h1 { background-color:#00ff00; } p { background-color:rgb(255,0,255); }
Grammaire CSS
background-color: color|transparent|initial|inherit;
Valeur de l'attribut
Valeur | Description |
---|---|
color_name | Définit la couleur de fond en utilisant le nom de la couleur (par exemple red). |
hex_number | Définit la couleur de fond en utilisant une valeur hexadécimale (par exemple #ff0000). |
rgb_number | Définit la couleur de fond en utilisant le code rgb (par exemple rgb(255,0,0)). |
transparent | Par défaut. La couleur de fond est transparente. |
inherit | Définit que la propriété background-color doit être héritée de l'élément parent. |
Détails techniques
Valeur par défaut : | transparent |
---|---|
Héritabilité : | no |
Version : | CSS1 |
Grammaire JavaScript : | object.style.backgroundColor="#00FF00" |
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge cette propriété.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | IE / Edge | Firefox | Safari | Opera |
1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- Page précédente background-clip
- Page suivante background-image