ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSで背景画像の透明度を設定する方法

CSSで背景画像の透明度を設定する方法

王林
王林オリジナル
2020-11-13 11:59:1526839ブラウズ

CSS で背景画像の透明度を設定する方法: [opacity: value|inherit;] などの不透明度属性を使用して設定できます。 value は不透明度を指定し、inherit は親要素から継承された不透明度属性の値を指定します。

CSSで背景画像の透明度を設定する方法

属性の紹介:

opacity 属性は、要素の不透明度レベルを設定します。

(学習ビデオ共有: css ビデオ チュートリアル)

文法:

opacity: value|inherit;

属性値:

value 規定不透明度。 0.0 (完全に透明) から 1.0 (完全に不透明) まで。

inherit opacity 属性の値は親要素から継承する必要があります。

例:

ヒント: CSS で背景画像に不透明度属性を直接追加することはできません。次の方法を使用すると、この制限を回避できます。

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;   
}

関連する推奨事項: CSS チュートリアル

以上がCSSで背景画像の透明度を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。