Maison  >  Article  >  interface Web  >  Comment définir la transparence de l'image d'arrière-plan en CSS

Comment définir la transparence de l'image d'arrière-plan en CSS

王林
王林original
2020-11-13 11:59:1526765parcourir

Comment définir la transparence de l'image d'arrière-plan en CSS : Vous pouvez utiliser l'attribut opacity pour la définir, tel que [opacity: value|inherit;]. value spécifie l'opacité et hérite spécifie la valeur de l'attribut d'opacité hérité de l'élément parent.

Comment définir la transparence de l'image d'arrière-plan en CSS

Introduction à l'attribut :

L'attribut opacité définit le niveau d'opacité de l'élément.

(Partage de vidéos d'apprentissage : tutoriel vidéo CSS)

Syntaxe :

opacity: value|inherit;

Valeur d'attribut :

valeur Règlement Opacité. De 0,0 (entièrement transparent) à 1,0 (entièrement opaque).

inherit doit hériter de la valeur de l'attribut opacity de l'élément parent.

Exemple :

Astuce : 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 : Tutoriel CSS

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