背景画像に透明度を設定するにはどうすればよいですか?

タイトルにあるように、画像自体の透明度を変更する方法はありません。背景画像を使用してCSSで書かれています。

div{
    position: relative;        
}
div:after{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(...);
    opacity: 0.5;
}

背景画像は透過pngです。

この要素は背景として透明度を設定し、別の要素がそれを覆い、この要素のコンテンツであるかのようにゲスト出演します。

CSS の不透明度属性は、画像の透明度属性を設定できます。

#div{
    background-image: url(img.png);
    opacity:0.4;
    filter:alpha(opacity=40);/* 针对 IE8 以及更早的版本 */ }

は、同様の視覚効果を実現するために、DIV 全体の透明度を変更することしかできません。 2. 互換性が許可されている場合 許可されている場合は、css3 filter-webkit-filter (以前の IE フィルターとは異なります) を使用します。

このウェブサイトがどのように実装されているかを見てください

Opacity in CSS background images

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