Was bedeutet das „a“ in rgba? CSS RGBA-Farbleitfaden

RGBA ist eine CSS-Farbe, mit der Farbwert und Transparenz festgelegt werden können

Unten sehen Sie die Verwendung von rgba(), um die Transparenz der weißen Farbe auf 50 % einzustellen.

P {
Farbe: rgba(255, 255, 255, 0,5);
}

RGBA ist eine Erweiterung des RGB-Farbmodells. Dieses Akronym steht für die Anfangsbuchstaben der drei Grundfarben Rot, Grün und Blau, und der Alphawert stellt die Transparenz/Opazität der Farbe dar.

RGBA-Syntax

Das Format der RGBA-Farbdarstellung ist:

rgba (rot, grün, blau, alpha)

Die ersten drei Werte (Rot, Grün und Blau) reichen von 0 bis 255 als ganze Zahlen bzw. von 0 % bis 100 % als Prozentwerte. Diese Werte beschreiben die Mengen der drei Grundfarben Rot, Grün und Blau, die in der beabsichtigten Farbe vorhanden sind.
Wenn Sie reines Rot einstellen möchten, setzen Sie den Rot-Parameter auf 255 und Grün und Blau auf 0.

Hintergrundfarbe: rgba(255, 0, 0, 1);

Ergebnis:

Es können auch Prozentsätze verwendet werden:

Hintergrundfarbe: rgba (100 %, 0 %, 0 %, 1);

Ergebnis:

Der vierte Wert, Alpha, gibt die Transparenz/Opazität der Farbe an und reicht von 0,0 bis 1,0.

Das folgende Beispiel stellt die Transparenz der gelben Farbe auf 50 % ein:

Farbe: rgba (255, 242, 0, 0,5);

Die CSS-Transluzenz ist mit Firefox, IE und Chrome kompatibel und die aktuellen Browserversionen sind relativ hoch. Sie können es bedenkenlos in Ihrem Projekt verwenden.