Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #87cefa und Farbwert #ee82ee

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.

Hintergrundfarbwert #87cefa			Schriftfarbwert #ee82ee
Detail	:	Hintergrund #87cefa	Detail	:	Schrift #ee82ee
Farbwert	:	#87cefa	Farbwert	:	#ee82ee
Farbe	:	lightskyblue	Farbe	:	violet
HTML	:	#87cefa	HTML	:	#ee82ee
HTML (Wert)	:	#87cefa	HTML (Wert)	:	#ee82ee
CSS	:	#87cefa	CSS	:	#ee82ee
CSS (Wert)	:	#87cefa	CSS (Wert)	:	#ee82ee
CSS (kürzest)	:	#87cefa	CSS (kürzest)	:	#ee82ee
CSS (RGB)	:	rgb(135,206,250)	CSS (RGB)	:	rgb(238,130,238)
CSS (%RGB)	:	rgb(52%,80%,98%)	CSS (%RGB)	:	rgb(93%,50%,93%)

Verlauf Hintergrundfarbwert #87cefa nach Schriftfarbwert #ee82ee
#87cefa	#95c3f8	#a4b8f6	#b3adf4	#c1a2f3	#d097f1	#df8cef	#ee82ee
#87cefa	#95c3f8	#a4b8f6	#b3adf4	#c1a2f3	#d097f1	#df8cef	#ee82ee

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

Hintergrundfarbwert #87cefa				Schriftfarbwert #ee82ee
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#87cefa	#87cefa	#87cefa	#87cefa	#ee82ee	#ee82ee	#ee82ee	#ee82ee
#98d5fa	#98d5fa	#73b0d6	#73b0d6	#f093f0	#f093f0	#cc6fcc	#cc6fcc
#a9dcfb	#a9dcfb	#6093b2	#6093b2	#f2a5f2	#f2a5f2	#aa5caa	#aa5caa
#bae3fc	#bae3fc	#4d758e	#4d758e	#f5b7f5	#f5b7f5	#884a88	#884a88
#cbeafc	#cbeafc	#39586b	#39586b	#f7c9f7	#f7c9f7	#663766	#663766
#dcf1fd	#dcf1fd	#263a47	#263a47	#fadbfa	#fadbfa	#442544	#442544
#edf8fe	#edf8fe	#131d23	#131d23	#fcedfc	#fcedfc	#221222	#221222
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #87cefa und Farbwert #ee82ee

Zebra-Effekt bei HTML-Tag th

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Er unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <th> mit unterschiedlichen Hintergrundfarben Farbwert #87cefa und Farbwert #ee82ee.

<style type="text/css"><!--
  th.ung { 
    background-color: #87cefa;
  }
  th.ger { 
    background-color: #ee82ee;
  }
//-->
</style>

Diese werden abwechselnd genutzt.

<table>
<tr><td class="ung">XA:A</td><td class="ger">XB:A</td><td class="ung">XC:A</td></tr>
<tr><td class="ung">XA:B</td><td class="ger">XB:B</td><td class="ung">XC:B</td></tr>
<tr><td class="ung">XA:C</td><td class="ger">XB:C</td><td class="ung">XC:C</td></tr>
</table>

Mehr zu th lesen Sie in Tabellen in HTML. Einzelheiten vom Tag <th>.

Wechsel der Textfarbe bei Hover mit HTML-Tag a

Mit HTML-Befehl <a> wird ein Hyperlink gesetzt und kann farblich gestaltet und hervorgehoben werden.

Die Textfarbe soll sich von Farbwert #87cefa auf Farbwert #ee82ee ändern, wenn man mit der Maus auf <a> zeigt. Bereiten wir zunächst eine Formatierung von <a> in Farbwert #87cefa vor.

Wir legen in diesem Beispiel Farbwert #87cefa als Textfarbe von <a> fest. Zwar verändern wir die Hintergrundfarbe nicht, setzen jedoch die Schriftart auf sans-serif:

<style type="text/css"><!--
  a { 
    font-family:sans-serif; 
    color:#87cefa;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Berührung mit der Maus die Textfarbe auf #ee82ee gesetzt wird.

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

Mehr zum Thema lesen Sie in Verweise und Protokolle in HTML. Die Beschreibung vom hier verwendeten Tag a finden Sie in der HTML Referenz unter <a>.