Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #adff2f und Farbwert #afeeee

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 #adff2f			Schriftfarbwert #afeeee
Detail	:	Hintergrund #adff2f	Detail	:	Schrift #afeeee
Farbwert	:	#adff2f	Farbwert	:	#afeeee
Farbe	:	greenyellow	Farbe	:	paleturquoise
HTML	:	#adff2f	HTML	:	#afeeee
HTML (Wert)	:	#adff2f	HTML (Wert)	:	#afeeee
CSS	:	#adff2f	CSS	:	#afeeee
CSS (Wert)	:	#adff2f	CSS (Wert)	:	#afeeee
CSS (kürzest)	:	#adff2f	CSS (kürzest)	:	#afeeee
CSS (RGB)	:	rgb(173,255,47)	CSS (RGB)	:	rgb(175,238,238)
CSS (%RGB)	:	rgb(67%,100%,18%)	CSS (%RGB)	:	rgb(68%,93%,93%)

Verlauf Hintergrundfarbwert #adff2f nach Schriftfarbwert #afeeee
#adff2f	#adfc4a	#adfa65	#adf780	#aef59c	#aef2b7	#aef0d2	#afeeee
#adff2f	#adfc4a	#adfa65	#adf780	#aef59c	#aef2b7	#aef0d2	#afeeee

Kombination von #adff2f und #afeeee
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				#afeeee ist nicht als Schriftfarbe auf Hintergrund #adff2f geeignet, weil die Unterschiede in der Helligkeit und Farbe unzureichend sind. Die Ähnlichkeit von #afeeee und #adff2f ergibt sich zu 94.99%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 5.01%.

Hintergrundfarbwert #adff2f				Schriftfarbwert #afeeee
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#adff2f	#adff2f	#adff2f	#adff2f	#afeeee	#afeeee	#afeeee	#afeeee
#b8ff4c	#b8ff4c	#94da28	#94da28	#baf0f0	#baf0f0	#96cccc	#96cccc
#c4ff6a	#c4ff6a	#7bb621	#7bb621	#c5f2f2	#c5f2f2	#7daaaa	#7daaaa
#d0ff88	#d0ff88	#62911a	#62911a	#d1f5f5	#d1f5f5	#648888	#648888
#dbffa5	#dbffa5	#4a6d14	#4a6d14	#dcf7f7	#dcf7f7	#4b6666	#4b6666
#e7ffc3	#e7ffc3	#31480d	#31480d	#e8fafa	#e8fafa	#324444	#324444
#f3ffe1	#f3ffe1	#182406	#182406	#f3fcfc	#f3fcfc	#192222	#192222
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #adff2f und Farbwert #afeeee

Wechsel der Textfarbe bei Hover bei HTML-Tag label

Die Textfarbe soll sich von Farbwert #adff2f auf Farbwert #afeeee ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <label> in Farbwert #adff2f vor.

Wir legen in diesem Beispiel bei <label> die Textfarbe auf Farbwert #adff2f fest. Zwar lassen wir die Hintergrundfarbe unverändert, ändern jedoch die Schriftart auf monospace.

<style type="text/css"><!--
  label { 
    color: #adff2f; 
    font-family: monospace;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe auf #afeeee ändert.

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

Weiteres zum Thema können Sie in Formulare in HTML lesen. Weiteres zum HTML-Tag <label>.

Zebra-Effekt mit HTML-Tag th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man vom Zebra-Effekt. Dieser Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <th> mit unterschiedlichen Hintergrundfarben Farbwert #adff2f und Farbwert #afeeee.

<style type="text/css"><!--
  th.gerade { 
    background-color: #adff2f;
  }
  th.ungerade { 
    background-color: #afeeee;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr><td class="gerade">Wa~a</td><td class="ungerade">Wb~a</td><td class="gerade">Wc~a</td></tr>
<tr><td class="gerade">Wa~b</td><td class="ungerade">Wb~b</td><td class="gerade">Wc~b</td></tr>
<tr><td class="gerade">Wa~c</td><td class="ungerade">Wb~c</td><td class="gerade">Wc~c</td></tr>
</table>

Weiteres zum Thema th finden Sie in Tabellen in HTML. Beschreibung vom Befehl <th>.