CSS-Farben

Colors are specified by using predefined color names, or RGB, HEX, HSL, RGBA, HSLA values.

CSS color names

In CSS, colors can be specified using color names:

Tomato
Orange
DodgerBlue
MediumSeaGreen
Gray
SlateBlue
Violet
LightGray

Probieren Sie es selbst aus

CSS/HTML unterstützt 140 Standardfarben.

CSS Hintergrundfarbe

Sie können die Hintergrundfarbe eines HTML-Elements einstellen:

Willkommen in China
China ist ein großartiges Land!

Beispiel

<h1 style="background-color:DodgerBlue;">China</h1>
<p style="background-color:Tomato;">China ist ein großartiges Land!</p>

Probieren Sie es selbst aus

CSS Textfarbe

Sie können die Farbe des Textes einstellen:

China

China ist ein großartiges Land!

China, offiziell die Volksrepublik China, ist ein Land in Ostasien.

Beispiel

<h1 style="color:Tomato;">China</h1>
<p style="color:DodgerBlue;">China ist ein großartiges Land!</p>
<p style="color:MediumSeaGreen;">China, offiziell die Volksrepublik China...</p>

Probieren Sie es selbst aus

CSS-Randfarbe

Sie können die Farbe der Rahmen einstellen:

Hallo Welt
Hallo Welt
Hallo Welt

Beispiel

<h1 style="border:2px solid Tomato;">Hallo Welt</h1>
<h1 style="border:2px solid DodgerBlue;">Hallo Welt</h1>
<h1 style="border:2px solid Violet;">Hallo Welt</h1>

Probieren Sie es selbst aus

CSS Farbwerte

In CSS können Sie auch RGB-Werte, HEX-Werte, HSL-Werte, RGBA-Werte oder HSLA-Werte verwenden, um Farben zu spezifizieren:

Gleichwertig der Farbe "Tomato":

rgb(255, 99, 71)
#ff6347
hsl(9, 100%, 64%)

Gleichwertig der Farbe "Tomato", aber mit 50% Transparenz:

rgba(255, 99, 71, 0.5)
hsla(9, 100%, 64%, 0.5)
<h3>Beispiel</h3>
<h1 style="background-color:rgb(255, 99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>

Probieren Sie es selbst aus

Erfahren Sie mehr über Farbwerte

In Kapitel 10 werden Sie lernen über RGB,HEX und HSL Mehr dazu.