Mots-clés de couleur CSS
Cette page explique les mots- clés transparent
, currentcolor
et .
inherit
Le mot-clé transparent
Le transparent
mot clé est utilisé pour rendre une couleur transparente. Ceci est souvent utilisé pour créer une couleur de fond transparente pour un élément.
Exemple
Ici, la couleur d'arrière-plan de l'élément <div> sera entièrement transparente et l'image d'arrière-plan apparaîtra :
body {
background-image: url("paper.gif");
}
div {
background-color: transparent;
}
Remarque : Le transparent
mot-clé est équivalent à rgba(0,0,0,0). Les valeurs de couleur RGBA sont une extension des valeurs de couleur RGB avec un canal alpha - qui spécifie l'opacité d'une couleur. Pour en savoir plus, consultez notre chapitre CSS RGB et notre chapitre CSS Colors .
Le mot-clé currentcolor
Le currentcolor
mot-clé est comme une variable qui contient la valeur actuelle de la propriété color d'un élément.
Ce mot-clé peut être utile si vous souhaitez qu'une couleur spécifique soit cohérente dans un élément ou une page.
Exemple
Dans cet exemple, la couleur de la bordure de l'élément <div> sera bleue, car la couleur du texte de l'élément <div> est bleue :
div {
color: blue;
border: 10px solid currentcolor;
}
Exemple
Dans cet exemple, la couleur d'arrière-plan de <div> est définie sur la valeur de couleur actuelle de l'élément body :
body {
color: purple;
}
div {
background-color:
currentcolor;
}
Exemple
Dans cet exemple, la couleur de bordure et la couleur d'ombre de <div> sont définies sur la valeur de couleur actuelle de l'élément body :
body {
color: green;
}
div {
box-shadow: 0px 0px
15px currentcolor;
border: 5px solid currentcolor;
}
Le mot-clé hérité
Le inherit
mot clé spécifie qu'une propriété doit hériter sa valeur de son élément parent.
Le inherit
mot-clé peut être utilisé pour n'importe quelle propriété CSS et sur n'importe quel élément HTML.
Exemple
Dans cet exemple, les paramètres de bordure de <span> seront hérités de l'élément parent :
div {
border: 2px solid red;
}
span {
border:
inherit;
}