Maison  >  Article  >  interface Web  >  Comment utiliser l'attribut opacité en CSS pour ajouter de la transparence à une image d'arrière-plan (code)

Comment utiliser l'attribut opacité en CSS pour ajouter de la transparence à une image d'arrière-plan (code)

不言
不言original
2018-08-20 11:18:495345parcourir

Le contenu de cet article explique comment utiliser l'attribut opacité pour ajouter de la transparence (code) aux images d'arrière-plan en CSS. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. .

Vous ne pouvez pas ajouter directement l'attribut d'opacité à l'image d'arrière-plan en CSS. Vous pouvez utiliser la méthode suivante pour contourner cette limitation :

div {
  width: 200px;  
  height: 200px;  
  display: block;  
  position: relative;
  }
div::after {
  content: "";  
  background: url(image.jpg);  
  opacity: 0.5;  
  top: 0;  
  left: 0;  
  bottom: 0;  
  right: 0;  
  position: absolute;  
  z-index: -1;   
}

Recommandations associées :

<.>CSS Transparent L'utilisation la plus précise des versions d'opacité et IE du filtre de transparence

Introduction à l'utilisation de la définition des effets de transparence à l'aide de l'attribut opacité de CSS3

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