opacity()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.

Die opacity() CSS Funktion wendet Transparenz auf die Muster im Eingabebild an. Das Ergebnis ist eine <filter-function>.

Probieren Sie es aus

Hinweis: Diese Funktion ähnelt der etablierteren opacity-Eigenschaft. Der Unterschied besteht darin, dass bei Filtern einige Browser Hardwarebeschleunigung für bessere Leistung bieten.

Syntax

css
opacity(amount)

Parameter

amount

Die Menge der Umwandlung, angegeben als <number> oder <percentage>. Ein Wert von 0% ist vollständig transparent, während ein Wert von 100% die Eingabe unverändert lässt. Werte zwischen 0% und 100% sind lineare Multiplikatoren auf den Effekt. Der anfängliche Wert für die Interpolation ist 1.

Formale Syntax

<opacity()> = 
opacity( [ <number> | <percentage> ]? )

Beispiele

Beispiele für korrekte Werte für opacity()

css
opacity(0%)   /* Completely transparent */
opacity(50%)  /* 50% transparent */
opacity(1)    /* No effect */

Spezifikationen

Specification
Filter Effects Module Level 1
# funcdef-filter-opacity

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
opacity()

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch