Ressourcen: 120 HTML Farbnamen - Kombination von Farbe slateblue und Farbwert #fffff0

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen Farbwerten, die einem bestimmten Schema folgen, definierte man noch 120 Werte und ordnete ihnen Namen zu.

Hintergrundfarbe slateblue			Schriftfarbwert #fffff0
Detail	:	Hintergrund slateblue	Detail	:	Schrift #fffff0
Farbe	:	slateblue	Farbwert	:	#fffff0
Farbwert	:	#6a5acd	Farbe	:	ivory
HTML	:	slateblue	HTML	:	#fffff0
HTML (Wert)	:	#6a5acd	HTML (Wert)	:	#fffff0
CSS	:	slateblue	CSS	:	#fffff0
CSS (Wert)	:	#6a5acd	CSS (Wert)	:	#fffff0
CSS (kürzest)	:	#6a5acd	CSS (kürzest)	:	#fffff0
CSS (RGB)	:	rgb(106,90,205)	CSS (RGB)	:	rgb(255,255,240)
CSS (%RGB)	:	rgb(41%,35%,80%)	CSS (%RGB)	:	rgb(100%,100%,94%)

Verlauf Hintergrundfarbe slateblue nach Schriftfarbwert #fffff0
#6a5acd	#7f71d2	#9489d7	#a9a0dc	#bfb8e1	#d4cfe6	#e9e7eb	#fffff0
#6a5acd	#7f71d2	#9489d7	#a9a0dc	#bfb8e1	#d4cfe6	#e9e7eb	#fffff0

Kombination von slateblue und #fffff0
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit von #fffff0 und slateblue ergibt sich zu 74.95%. Die Lesbarkeit dieser Farbkombination liegt damit bei 25.05%. #fffff0 ist nicht als Schriftfarbe auf Hintergrund slateblue geeignet, weil die Farben zu ähnlich sind.

Hintergrundfarbe slateblue				Schriftfarbwert #fffff0
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6a5acd	#6a5acd	#6a5acd	#6a5acd	#fffff0	#fffff0	#fffff0	#fffff0
#7f71d4	#7f71d4	#5a4daf	#5a4daf	#fffff2	#fffff2	#dadacd	#dadacd
#9489db	#9489db	#4b4092	#4b4092	#fffff4	#fffff4	#b6b6ab	#b6b6ab
#a9a0e2	#a9a0e2	#3c3375	#3c3375	#fffff6	#fffff6	#919189	#919189
#bfb8e9	#bfb8e9	#2d2657	#2d2657	#fffff8	#fffff8	#6d6d66	#6d6d66
#d4cff0	#d4cff0	#1e193a	#1e193a	#fffffa	#fffffa	#484844	#484844
#e9e7f7	#e9e7f7	#0f0c1d	#0f0c1d	#fffffc	#fffffc	#242422	#242422
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe slateblue und Farbwert #fffff0

Wechsel der Hintergrundfarbe bei Hover von Befehl dd

Die Hintergrundfarbe soll sich von Farbe slateblue auf Farbwert #fffff0 ändern, wenn man mit der Maus auf <dd> zeigt. Bereiten wir zunächst die Formatierung von <dd> in Farbe slateblue vor.

Wir legen in diesem Beispiel die Hintergrundfarbe von <dd> auf Farbe slateblue fest und erhöhen die Größe der Schrift auf 111%:

<style type="text/css"><!--
  dd { 
    background-color:slateblue; 
    font-size:111%;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Hover die Hintergrundfarbe auf #fffff0 ändert.

<style type="text/css"><!--
  dd:hover { 
    background-color:#fffff0;
  }
//-->
</style>

Weiteres zum Thema können Sie in Listen und Glossare in HTML finden. Die Beschreibung vom HTML-Tag dd erfahren Sie in der HTML Referenz unter <dd>.

Wechsel der Textfarbe bei Hover bei Tag h1

Mit HTML-Tag <h1> erzeugen Sie eine Überschrift. Diese kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbe slateblue auf Farbwert #fffff0 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <h1> in Farbe slateblue vor.

Wir legen in diesem Beispiel Farbe slateblue als Textfarbe von <h1> fest. Die Hintergrundfarbe behalten wir bei. Die Schriftart ändern wir auf monospace.

<style type="text/css"><!--
  h1 { 
    color:slateblue; 
    font-family:monospace;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Textfarbe auf #fffff0 gesetzt wird.

<style type="text/css"><!--
  h1: hover { 
    color: #fffff0;
  }
//-->
</style>

Mehr zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten vom hier gezeigten Tag <h1>.