Es gibt verschiedene Möglichkeiten, Farben in CSS auszudrücken

Es gibt 6 Möglichkeiten, Farben in CSS auszudrücken: 1. Englische Wörter wie Rot, Blau; 2. Hexadezimale Werte wie „#FF0000“; 3. RGB wie „RGB(255,0 , 0)“; 4. RGBA, zum Beispiel „RGB(255,0,0,0.5)“; 5. HSL; 6. HSLA.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, CSS3-Version, Dell G3-Computer.

Empfohlene Tutorials: CSS-Video-Tutorial

Mehrere Farbausdrücke in Webseiten verwenden englische Wörter, um Farben darzustellen, wie z. B. Rot, Blau usw.

2

Dreistellige Hexadezimalzahl, z. B. #F00 (jede Farbe wird durch eine Hexadezimalzahl dargestellt)

Sechsstellige Hexadezimalzahl, z. B. #FF0000 (jede Farbe wird durch zwei Hexadezimalzahlen dargestellt)

3

RGB drei Primärfarben: RGB(255,0,0). Die drei angegebenen Parameter repräsentieren die Farbwerte von Rot, Grün und Blau, von 0 bis 225. Dezimaldarstellung

RGB, RGB (100 %, 0 %, 0 %), Prozentzeichen verwenden

Hinweis: Die oben genannten Ausdrücke gehören alle zum RGB-Farbsystem (Rot, Grün, Blau)

4, RGBA: Wie RGB, nur mit einer zusätzlichen Transparenz, z. B. RGB( 255,0,0,0,5). Der vierte Wert reicht von 0-1, 0 ist vollständig transparent, 1 ist vollständig undurchsichtig

5 HSL (wird eher zum Erlernen der nachträglichen Farbanpassung verwendet): Farbton, Sättigung, Helligkeit. Beispiel: HSL(360,100 %,50 %).

Farbton: Dies ist das Grundattribut einer Farbe, das wir normalerweise als Farbnamen bezeichnen, z. B. Rot usw.

Sättigung: Bezieht sich auf die Reinheit der Farbe. Je höher sie ist, desto reiner ist die Farbe , und je niedriger es ist, desto grauer wird es im Bereich von 0-100 %. Helligkeit: Es ist die Helligkeit der Farbe, je heller die Farbe Farbe, desto dunkler ist die Farbe. Es dauert 0-100 %.

(Wenn Sie möchten, dass die Seite ein Farbsystem verwendet, können Sie HSL verwenden)

6: Es hat mehr Transparenz als HSL.

Verwendung:

①Farbe:blau;

Die erste Methode besteht darin, das Farbattribut aufzurufen, den englischen Namen der Farbe nach dem Doppelpunkt einzugeben und mit einem Semikolon zu beenden.

Diese Methode ist unkompliziert, es gibt jedoch nur sehr wenige Farbtypen, die dargestellt werden können.

②Farbe:#000000;

Der zweite Typ beginnt mit „#“, jede Ziffer kann sein: 0, 1, 2, 3, 4, 5, 6, 7, 8,

9, a, b, c ,d,e,f. Die ersten Ziffern 1 und 2 stehen für Rot, die Ziffern 3 und 4 stehen für Grün und die Ziffern 5 und 6

stehen für Blau. Ähnlich wie bei der RGB-Farbdarstellung werden die drei Primärfarben Rot, Grün und Blau zu

verschiedenen Farben kombiniert, und es gibt viele Arten.

③color:rgb(0,0,0);

Die dritte Methode, RGB-Darstellung. Es gibt zwei Arten von Werten: numerische Werte, alle Werte sind 0-255; Prozentwerte

, alle Werte sind 0%-100%. Ihr gemeinsames Merkmal ist, dass der erste Wert Rot darstellt, der zweite

-Wert Grün und der dritte Wert Blau darstellt. Verschiedene Farben können durch Kombinationen zum Ausdruck gebracht werden.

④color:rgba(0,0,0,0.5);

Die vierte, RGBA-Darstellung. Es handelt sich um eine aktualisierte Version der RGB-Darstellung und fügt ein neues Transparenzattribut hinzu.

Die ersten drei Attributwerte entsprechen der RGB-Notation. Der Wertebereich des vierten Attributwerts beträgt 0-1, was auf zwei Dezimalstellen genau sein kann.

⑤color:hsl (0, 100 %, 100 %);

Die fünfte Methode, HSL-Darstellung. Seine Bedeutung: H steht für Farbton, der Wertebereich liegt zwischen 0 und

360, 0 und 360 stehen für Rot, 120 steht für Grün und 240 steht für Blau. S steht für Sättigung

und der Wertebereich liegt zwischen 0 % und 100 %. L steht für Helligkeit, der Wertebereich liegt zwischen 0 % und 100 %.

⑥color:hsla(0,100%,100%,0.5);

Sechstens HSLA-Notation. Es handelt sich um eine erweiterte Version der HSL-Notation, die das Attribut

Wert der Transparenz mit einem Wertebereich von 0-1 hinzufügt.

Weitere Kenntnisse zum Thema Programmierung finden Sie unter:

Programmierlehre

! !

Das obige ist der detaillierte Inhalt vonEs gibt verschiedene Möglichkeiten, Farben in CSS auszudrücken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!