Wie stelle ich die Deckkraft für Div-Hintergründe ein, ohne die enthaltenen Elemente in IE 8 zu beeinträchtigen?

So legen Sie die Deckkraft für Div-Hintergründe fest, ohne die enthaltenen Elemente in IE 8 zu ändern

Beim Versuch, Deckkraft auf den Hintergrund eines Div-Elements anzuwenden Ohne die darin enthaltenen Elemente im IE 8 zu beeinträchtigen, können die folgenden Methoden häufig verwendet werden fail:

• Verwendung der CSS-Eigenschaft opacity: Dies wirkt sich sowohl auf das div als auch auf seinen Inhalt aus.
• Verwendung von PNG-Bildern mit opacity: Dies ist keine dynamische Lösung.

Lösung

Verwenden Sie stattdessen die CSS-Funktion rgba() um die Hintergrundfarbe anzugeben, einschließlich eines Alphakanals für die Deckkraft:

.myelement {
    background: rgba(200, 54, 54, 0.5);
}

Für IE8-Kompatibilität

Um ältere Versionen von IE zu unterstützen, sollten Sie CSS3Pie verwenden, das hinzufügt RGBA-Unterstützung für IE. Geändertes Stylesheet:

.myelement {
    background: rgba(200, 54, 54, 0.5);
    -pie-background: rgba(200, 54, 54, 0.5);
    behavior: url(PIE.htc);
}

Alternative Methode für IE-Filter

IE-Filter können auch mit dem Schlüsselwort „gradient“ verwendet werden:

.myelement {
    filter: gradient(startColorstr='#990000', endColorstr='#990000', GradientType=0);
    opacity: 0.5;
}

Hinweis dass der Deckkraftwert nicht über die Filtereigenschaft direkt im IE angegeben werden kann.

Das obige ist der detaillierte Inhalt vonWie stelle ich die Deckkraft für Div-Hintergründe ein, ohne die enthaltenen Elemente in IE 8 zu beeinträchtigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!