Comment faire en sorte que IE ff Opera prenne en charge la transparence Alpha en même temps

Comment faire en sorte que IE ff Opera prenne en charge la transparence Alpha en même temps_Échange d'expérience

WBOY

Libérer： 2016-05-16 12:04:41

original

1044 Les gens l'ont consulté

Aujourd'hui, nous allons découvrir ensemble la transparence CSS Alpha.
Connaissances connexes sur la transparence CSS Alpha. Tout d'abord, veuillez regarder le code suivant :

Copiez le code Le code est le suivant :

filter:alpha(opacity= 50); /* IE */ 
-moz-opacity:0.5; /* Moz + FF */ 
opacity: 0.5 /* Navigateurs prenant en charge CSS3 (FF 1.5 prend également en charge ) */ 
 

Explication simple, IE utilise l'attribut privé filter:alpha(opacity), Moz Family utilise l'attribut privé -moz-opacity, et l'attribut standard est opacity (CSS 3, Moz Family prend en charge partiellement CSS3). La valeur suivante est la transparence, utilisez un pourcentage ou une décimale (alpha (opacité)). Utilisez une valeur supérieure à 0 et inférieure à 100, qui est en fait un pourcentage).

Vous ne voyez pas Opera à partir du code ci-dessus. C'est vrai, Opera ne prend pas encore en charge l'opacité standard et ne dispose pas non plus de ses propres propriétés privées pour prendre en charge la transparence Alpha.
Cependant, nous savons qu'Opera prend en charge les images PNG transparentes Alpha (bien sûr, Moz Family les prend également en charge). Nous pouvons donc utiliser une image d'arrière-plan pour obtenir une transparence Alpha.

La clé est :

Copiez le code Le code est le suivant :

background:transparent url(alpha80.png) left top repeat!important 
background:#ccc; 
filter:alpha(opacity=50); Alpha PNG transparent, nous n'avons donc pas besoin d'utiliser ses propriétés privées. Bien sûr, vous pouvez utiliser l'opacité standard, mais n'utilisez pas une image alpha transparente et une opacité en même temps, sinon cela devient un mélange des deux. Vous pouvez télécharger l'exemple ci-dessus et consulter les commentaires de /*opacity:.5;*/. 