CSS Farben
Farben werden mithilfe vordefinierter Farbnamen oder RGB-, HEX-, HSL-, RGBA- und HSLA-Werten angegeben.
CSS Farbnamen
In CSS kann eine Farbe durch die Verwendung eines vordefinierten Farbnamens angegeben werden:
CSS/HTML unterstützt 140 Standardfarbnamen.
CSS Hintergrundfarbe
Sie können die Hintergrundfarbe für HTML-Elemente festlegen:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Beispiel
<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>
Try it Yourself »
CSS Textfarbe
Sie können die Farbe des Textes festlegen:
Hello World
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Beispiel
<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem
ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>
Try it Yourself »
CSS Rahmenfarbe
Sie können die Farbe der Rahmen festlegen:
Hello World
Hello World
Hello World
Beispiel
<h1 style="border:2px
solid Tomato;">Hello
World</h1>
<h1 style="border:2px
solid DodgerBlue;">Hello
World</h1>
<h1 style="border:2px
solid Violet;">Hello
World</h1>
Try it Yourself »
CSS Farbwerte
In CSS können Farben auch mit RGB-, HEX-, HSL-, RGBA- und HSLA-Werten angegeben werden:
Entspricht dem Farbnamen "Tomato":
Gleicher Farbname wie „Tomato“, aber 50 % transparent:
Beispiel
<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>
Try it Yourself »
CSS — Farben – W3Schools-Video
Dieses Video ist eine Einführung in CSS-Farben.
Teil einer Reihe von Video-Tutorials zum Erlernen von CSS für Anfänger!
