CSS-Typ <alpha-value>
Der <alpha-value>-CSS-Datentyp stellt einen Wert dar, der entweder ein <number> oder ein <percentage> sein kann und den Alphakanal beziehungsweise die Transparenz einer Farbe angibt.
Syntax
Der Wert eines <alpha-value> wird entweder als <number> oder als <percentage> angegeben.
Bei einer Angabe als Zahl liegt der sinnvolle Bereich zwischen 0 (vollständig transparent) und 1.0 (vollständig deckend), mit Dezimalwerten dazwischen. Beispielsweise bedeutet 0.5, dass die Vordergrund- und die Hintergrundfarbe jeweils zur Hälfte verwendet werden. Werte außerhalb des Bereichs von 0 bis 1 sind zulässig, werden aber auf diesen Bereich begrenzt.
Wird der Alphawert als Prozentsatz angegeben, entspricht 0% vollständiger Transparenz und 100% vollständiger Deckkraft.
Interpolation
Bei Animationen werden Werte des CSS-Datentyps <alpha-value> als reelle Gleitkommazahlen interpoliert. Die Geschwindigkeit der Interpolation wird durch die der Animation zugeordnete Easing-Funktion bestimmt.
Formale Syntax
<alpha-value> =
<number> |
<percentage>
Beispiele
Deckkraft der Textfarbe festlegen
Die Funktion rgb() akzeptiert einen vierten, optionalen Wert zur Angabe eines Alphawerts.
Das folgende Beispiel zeigt, wie Sie mithilfe des Alphawerts eine Farbe mit 60% Deckkraft anwenden:
/* <rgb()> */
color: rgb(34 12 64 / 60%);
Schwellenwert für eine Bildform festlegen
Hier wird ein Alphawert verwendet, um zu bestimmen, welche Teile eines Bildes als Teil einer Form gelten:
/* shape-image-threshold */
shape-image-threshold: 70%;
shape-image-threshold: 0.7;
Spezifikationen
| Spezifikation |
|---|
| CSS Color Module Level 4 # typedef-color-alpha-value |