English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Il existe plusieurs méthodes pour définir des valeurs de couleur en CSS.
Les mots-clés de couleur ne sont pas sensibles à la casse et représentent des couleurs spécifiques, par exemple rouge, vert, bleu, jaune, noir, etc.
h1 {
color: rouge;
}
p {
background-color: jaune;
}Essayez de voir‹/›Attention :Le support des mots-clés de couleur varie selon les navigateurs, par conséquent, pour des raisons de sécurité, il est préférable d'utiliser des hexadécimaux ou des symboles fonctionnels.
VoirMots-clés de couleurliste complète
Le mot-clé transparent représente une couleur complètement transparente.
Ce mot-clé peut être considéré comme une abréviation de rgba(0,0,0,0), c'est aussi sa valeur calculée.
h1 {
color: transparent;
}
p {
background-color: transparent;
}Essayez de voir‹/›Attention : CSS 2.1n'autorisent que deux attributs,background-coloretborder-colorAccepte le mot-clé transparent. Cependant, CSS3A étendu la valeur de couleur pour inclure le mot-clé transparent, permettant son utilisation avec tous les attributs acceptant des valeurs de couleur.
Le modèle de couleur RGB (rouge, vert, bleu) est la méthode la plus courante pour définir les valeurs de couleur dans CSS. Vous pouvez définir la couleur en utilisant le modèle RGB de deux manières :
La valeur RGB en notation hexadécimale # est composée des trois ou six caractères hexadécimaux (0-9composés des caractères.
Lorsque vous utilisez le symbole à six chiffres (#rrggbb), le premier paires (rr) représente la valeur rouge, le second paires (gg) représente la valeur verte, et le dernier paires (bb) représente la valeur bleue.
h1 {
color: #f8;
}
p {
background-color: #ff88;
}Essayez de voir‹/›Avis :Le système de notation hexadécimale à trois chiffres (#rgb) peut être converti en format à six chiffres (#rrggbb) en copiant les chiffres plutôt qu'en ajoutant des zéros. Par exemple : #03;33ff, mais les deux valeurs représentent la même couleur. La valeur f peut être étendue à #00
La valeur RGB spécifiée dans la notation fonctionnelle est: rgb(red, green, blue). Chaque paramètre (red, green et blue) définit l'intensité de la couleur, qui peut être une valeur entière (de 0 à255) ou une valeur en pourcentage (de 0% à100%)
Valeur entière255Correspond100%, en notation hexadécimale f ou ff : par exemple, rgb(0,255,255) = rgb(0%,100%,100%) = #0ff, toutes les valeurs représentent la même couleur, c'est-à-dire aqua. Les espaces autour des valeurs numériques sont autorisés.
h1 {
color: rgb(0,255,255);
}
p {
background-color: rgb(0%,100%,100%);
}Essayez de voir‹/›Les valeurs 0 ou 0% indiquent l'absence de valeur de couleur spécifique, tandis que la valeur255,100% et f ou ff indiquent que la valeur de couleur est complètement présente.
Attention :Hors de la gamme valide (0-255ou 0%-10La valeur de (%) sera automatiquement tronquée ou modifiée pour être dans la gamme prise en charge par l'appareil.
Voir concernantCSS3Couleurdu tutoriel pour comprendre les nouveaux symboles de fonctionnalités (par exemple) rgba(), hsl() et hsla() pour définir les valeurs de couleur.