Maison  >  Article  >  interface Web  >  Comment rendre les images transparentes en utilisant CSS

Comment rendre les images transparentes en utilisant CSS

(*-*)浩
(*-*)浩original
2020-01-10 15:38:322218parcourir

Comment rendre les images transparentes en utilisant CSS

Créer des images transparentes avec CSS est simple. (Apprentissage recommandé : Tutoriel CSS )

Remarque : L'attribut CSS OPACITY fait partie de la norme de recommandation CSS du W3C.

Exemple 1 - Création d'une image transparente

La propriété CSS3 qui définit l'effet de transparence est l'opacité.

Tout d’abord, nous allons vous montrer comment créer une image transparente avec CSS.

Image régulière :

Comment rendre les images transparentes en utilisant CSS

Même image avec transparence :

Comment rendre les images transparentes en utilisant CSS

Veuillez consulter le CSS suivant :

img
{
opacity:0.4;
filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */}

IE9, Firefox, Chrome, Opera et Safari utilisent l'attribut opacity pour définir la transparence. La propriété d'opacité peut être définie sur des valeurs comprises entre 0,0 et 1,0.

Plus la valeur est petite, plus elle est transparente. IE8 et versions antérieures utilisent le filtre filter:alpha(opacity=x). x peut prendre des valeurs de 0 à 100. Plus la valeur est petite, plus elle est transparente.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn