Wie stelle ich die Transparenz des Hintergrundbilds ein?

Wie bereits erwähnt, kann die Transparenz des Bildes selbst jetzt nicht geändert werden. Das Bild ist in CSS mit Hintergrundbild geschrieben. Gibt es eine Möglichkeit, die Transparenz dafür festzulegen?

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

Das Hintergrundbild ist PNG mit Transparenz. Das

-Element legt die Transparenz als Hintergrund fest, und ein anderes Element deckt ihn ab und tritt darauf als Gast auf, wobei es vorgibt, der Inhalt dieses Elements zu sein.

Das Deckkraftattribut von CSS kann das Transparenzattribut des Bildes festlegen.

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

Sie können nur die Transparenz des gesamten DIV ändern ein ähnlicher visueller Effekt:
1.Opacity-Attribut
2. Wenn die Kompatibilität es zulässt, verwenden Sie den CSS3-Filter-Webkit-Filter (anders als der vorherige IE-Filter).

Schauen Sie sich an, wie diese Website umgesetzt wird

Opacity in CSS background images

Das obige ist der detaillierte Inhalt vonWie stelle ich die Transparenz des Hintergrundbilds ein?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!