La transparence en CSS
La transparence en CSS
-
Objectif
-
Introduction
- Commençons avec la gestion de la transparence. Son adoption sur le web a longtemps été retardée,notamment en raison du fait que la norme CSS2.1 ne fait état d’aucune règle de gestion de la transparence.
- C’est désormais chose faite avec CSS3 qui définit la règle opacity et les fonctions de couleurs rgba et hsla.
- Le mot-clé transparent est, quant à lui, étendu à une utilisation pour toutes les propriétés de couleur.
-
opacity
-
Syntaxe CSS
-
Définition et usage
- La propriété
opacity
définit le niveau d’opacité d’un élément. - Le niveau d’opacité décrit le niveau de transparence, où :
- 1 n’est pas transparent du tout,
- 0.5 est transparent à 50%
- 0 est complètement transparent.
-
Définition et usage
- exemple d’opacité à 60 % appliqué sur une div :
-
rgba, hsla, transparent
opacity: number|initial|inherit;
div{
opacity: 0.6;
}