Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #eee8aa und Farbwert #00fa9a

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbwert #eee8aa			Schriftfarbwert #00fa9a
Detail	:	Hintergrund #eee8aa	Detail	:	Schrift #00fa9a
Farbwert	:	#eee8aa	Farbwert	:	#00fa9a
Farbe	:	palegoldenrod	Farbe	:	mediumspringgreen
HTML	:	#eee8aa	HTML	:	#00fa9a
HTML (Wert)	:	#eee8aa	HTML (Wert)	:	#00fa9a
CSS	:	#eee8aa	CSS	:	#00fa9a
CSS (Wert)	:	#eee8aa	CSS (Wert)	:	#00fa9a
CSS (kürzest)	:	#eee8aa	CSS (kürzest)	:	#00fa9a
CSS (RGB)	:	rgb(238,232,170)	CSS (RGB)	:	rgb(0,250,154)
CSS (%RGB)	:	rgb(93%,90%,66%)	CSS (%RGB)	:	rgb(0%,98%,60%)

Verlauf Hintergrundfarbwert #eee8aa nach Schriftfarbwert #00fa9a
#eee8aa	#cceaa7	#aaeda5	#88efa3	#66f2a0	#44f49e	#22f79c	#00fa9a
#eee8aa	#cceaa7	#aaeda5	#88efa3	#66f2a0	#44f49e	#22f79c	#00fa9a

Kombination von #eee8aa und #00fa9a
Cras vestibulum tristique erat, ac interdum justo cursus in. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#00fa9a eignet sich nicht als Schriftfarbe auf Hintergrund #eee8aa. Die Unterschiede in der Helligkeit und Farbe sind unzureichend. Die Ähnlichkeit der Farben #00fa9a und #eee8aa ergibt sich zu 94.73%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 5.27%.

Hintergrundfarbwert #eee8aa				Schriftfarbwert #00fa9a
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#eee8aa	#eee8aa	#eee8aa	#eee8aa	#00fa9a	#00fa9a	#00fa9a	#00fa9a
#f0ebb6	#f0ebb6	#ccc691	#ccc691	#24faa8	#24faa8	#00d684	#00d684
#f2eec2	#f2eec2	#aaa579	#aaa579	#48fbb6	#48fbb6	#00b26e	#00b26e
#f5f1ce	#f5f1ce	#888461	#888461	#6dfcc5	#6dfcc5	#008e58	#008e58
#f7f5da	#f7f5da	#666348	#666348	#91fcd3	#91fcd3	#006b42	#006b42
#faf8e6	#faf8e6	#444230	#444230	#b6fde2	#b6fde2	#00472c	#00472c
#fcfbf2	#fcfbf2	#222118	#222118	#dafef0	#dafef0	#002316	#002316
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #eee8aa und Farbwert #00fa9a

Zebra-Effekt von Befehl tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man vom so genannten Zebra-Effekt. Er unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <tr> mit unterschiedlichen Hintergrundfarben Farbwert #eee8aa und Farbwert #00fa9a.

<style type="text/css"><!--
  tr.ger { 
    background-color:#eee8aa;
  }
  tr.ung { 
    background-color: #00fa9a;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd verwendet.

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

Mehr zum Thema können Sie in Tabellen in HTML nachsehen. Einzelheiten des Tag tr finden Sie in der HTML Referenz unter <tr>.

Wechsel der Hintergrundfarbe bei Hover mit Befehl abbr

Die Hintergrundfarbe soll sich von Farbwert #eee8aa auf Farbwert #00fa9a ändern, wenn man mit der Maus auf <abbr> zeigt. Wir bereiten zunächst eine Formatierung von <abbr> in Farbwert #eee8aa vor.

Als Beispiel ändern wir bei <abbr> die Hintergrundfarbe auf Farbwert #eee8aa. Die Schriftgröße verkleinern wir auf 87%.

<style type="text/css"><!--
  abbr { 
    background-color: #eee8aa; 
    font-size: 87%;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Hintergrundfarbe auf #00fa9a ändert.

<style type="text/css"><!--
  abbr: hover { 
    background-color: #00fa9a;
  }
//-->
</style>

Der Tag abbr ist in der HTML Referenz bei <abbr> ausführlich beschrieben.