Compatibilité des codes couleurs Web non transparentes avec les navigateurs.
Le format de code couleur Web Hexadécimal pour les propriétés CSS ou les attributs HTML est reconnu par tous les navigateurs. Certaines couleurs Web Hexadécimal sont associée à un nom qui correspnd au format de code couleur Nommé. Je vous conseille de ne pas utiliser le format de code couleur Nommé car certains noms sont plus ou moins récents, c'est le cas de la couleur prédéfinie "rebeccapurple" qui est apparue dans le brouillon des spécifiCcations CSS4 en 2017.
Si le code couleur Web RGB ou HSL n'est pas reconnu par le navigateur
alors, votre couleur ne sera pas interprétée.
Vous risquez de vous retrouver dans des situations embarassantes si vous mélanger les codes couleurs Web. L'exemple ci-dessous pause problème sous le navigateur Internet Explorer < 9+. Le fond est blanc par défaut car le format couleur HSL n'est pas interprété et le texte sera aussi blanc.
color : #fff;
background-color : hsl(199,59%,47%);
-
Le code couleur Web RGB (Red, Green, Blue) introduit en CSS2
-
Le format couleur RGB est compatible avec le navigateur Chrome 1+
Chrome 1+ Le format couleur RGB est compatible avec le navigateur FireFox 1+
FireFox 1+ Le format couleur RGB est compatible avec le navigateur Safari 1+
Safari 1+ Le format couleur RGB est compatible avec le navigateur Internet Explorer 4+
Internet Explorer 4+ Le format couleur RGB est compatible avec le navigateur Opera 3.5+
Opera 3.5+
-
Le code couleur Web HSL (Hue, Saturation, Lightness) introduit en CSS3
-
Le format couleur HSL est compatible avec le navigateur Chrome 1+
Chrome 1+ Le format couleur HSL est compatible avec le navigateur FireFox 1+
FireFox 1+ Le format couleur HSL est compatible avec le navigateur Safari 3.1+
Safari 3.1+ Le format couleur HSL est compatible avec le navigateur Internet Explorer 9+
Internet Explorer 9+ Le format couleur HSL est compatible avec le navigateur Opera 9.5+
Opera 9.5+
Compatibilité des couleurs Web transparentes avec les navigateurs.
Le format de code couleur Nommée avec transparence n'existe pas pour le web.
(*)Dans les futurs spécifications CSS4, le format de code couleur Hexadécimal acceptera en fin de code un alpha background-color : #00ffff77;
. A ce jour (10/2016), aucun navigateur ne le reconnait.
Pour information, Internet Explorer utilise le format de code couleur Hexadécimal avec un alpha mais au début pour la propriété Css propriétaire Filter.
filter: progid:DXImageTransform.Microsoft.gradient(
startColorstr='#69f1e767', endColorstr='#feb645', GradientType=0
);
Si le format de code couleur avec transparence RGBA ou HSLA n'est pas reconnu par le navigateur
alors, votre couleur ne sera pas interprétée.
En règle générale, on fait précéder la couleur avec Alpha par une couleur non Alpha.
background-color : #3191be;
background-color : hsl(199,59%,47%,0.25);
-
Le code couleur Web avec transparence RGBA (Red, Green, Blue, Alpha) introduit en CSS3
-
Le format couleur RGBA est compatible avec le navigateur Chrome 1+
Chrome 1+ Le format couleur RGBA est compatible avec le navigateur FireFox 3+
FireFox 3+ Le format couleur RGBA est compatible avec le navigateur Safari 3.1+
Safari 3.1+ Le format couleur RGBA est compatible avec le navigateur Internet Explorer 9+
Internet Explorer 9+ Le format couleur RGBA est compatible avec le navigateur Opera 10+
Opera 10+
-
Le code couleur Web avec transparence HSLA (Hue, Saturation, Lightness, Alpha) introduit en CSS3
-
Le format couleur HSLA est compatible avec le navigateur Chrome 1+
Chrome 1+ Le format couleur HSLA est compatible avec le navigateur FireFox 3+
FireFox 3+ Le format couleur HSLA est compatible avec le navigateur Safari 3.1+
Safari 3.1+ Le format couleur HSLA est compatible avec le navigateur Internet Explorer 9+
Internet Explorer 9+ Le format couleur HSLA est compatible avec le navigateur Opera 10+
Opera 10+