Ressourcen: 120 HTML Farbnamen - Kombination von Farbe azure und Farbwert #228b22

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 azure			Schriftfarbwert #228b22
Detail	:	Hintergrund azure	Detail	:	Schrift #228b22
Farbe	:	azure	Farbwert	:	#228b22
Farbwert	:	#f0ffff	Farbe	:	forestgreen
HTML	:	azure	HTML	:	#228b22
HTML (Wert)	:	#f0ffff	HTML (Wert)	:	#228b22
CSS	:	azure	CSS	:	#228b22
CSS (Wert)	:	#f0ffff	CSS (Wert)	:	#228b22
CSS (kürzest)	:	#f0ffff	CSS (kürzest)	:	#228b22
CSS (RGB)	:	rgb(240,255,255)	CSS (RGB)	:	rgb(34,139,34)
CSS (%RGB)	:	rgb(94%,100%,100%)	CSS (%RGB)	:	rgb(13%,54%,13%)

Verlauf Hintergrundfarbe azure nach Schriftfarbwert #228b22
#f0ffff	#d2eedf	#b5ddbf	#97cda0	#7abc80	#5cac61	#3f9b41	#228b22
#f0ffff	#d2eedf	#b5ddbf	#97cda0	#7abc80	#5cac61	#3f9b41	#228b22

Kombination von azure und #228b22
Cras id velit ante. 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 vestibulum tristique erat, ac interdum justo cursus in.				#228b22 eignet sich als Schriftfarbe auf Hintergrund azure. Die Unterschiede in Helligkeit und Farbe sind gut. Die Ähnlichkeit von #228b22 und azure ergibt sich zu 79.64%. Die Lesbarkeit dieser Farbkombination liegt damit bei 20.36%.

Hintergrundfarbe azure				Schriftfarbwert #228b22
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f0ffff	#f0ffff	#f0ffff	#f0ffff	#228b22	#228b22	#228b22	#228b22
#f2ffff	#f2ffff	#cddada	#cddada	#419b41	#419b41	#1d771d	#1d771d
#f4ffff	#f4ffff	#abb6b6	#abb6b6	#61ac61	#61ac61	#186318	#186318
#f6ffff	#f6ffff	#899191	#899191	#80bc80	#80bc80	#134f13	#134f13
#f8ffff	#f8ffff	#666d6d	#666d6d	#a0cda0	#a0cda0	#0e3b0e	#0e3b0e
#faffff	#faffff	#444848	#444848	#bfddbf	#bfddbf	#092709	#092709
#fcffff	#fcffff	#222424	#222424	#dfeedf	#dfeedf	#041304	#041304
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe azure und Farbwert #228b22

Zebra-Effekt bei Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man vom Zebra-Effekt. Der Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <tr> mit unterschiedlichen Hintergrundfarben Farbe azure und Farbwert #228b22.

<style type="text/css"><!--
  tr.ying { 
    background-color: azure;
  }
  tr.yang { 
    background-color:#228b22;
  }
//-->
</style>

Diese Klassen werden dann abwechselnd genutzt.

<table>
<tr class="ying"><td>Ua/a</td><td>Ub/a</td><td>Uc/a</td></tr>
<tr class="yang"><td>Ua/b</td><td>Ub/b</td><td>Uc/b</td></tr>
<tr class="ying"><td>Ua/c</td><td>Ub/c</td><td>Uc/c</td></tr>
</table>

Weiteres zu tr können Sie in Tabellen in HTML erfahren. Weiteres zum hier genutzten HTML-Tag tr ist in der HTML Referenz unter <tr> genau zusammengestellt.

Wechsel der Hintergrundfarbe bei Hover mit Befehl q

Die Hintergrundfarbe soll sich von Farbe azure auf Farbwert #228b22 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Formatierung von <q> in Farbe azure vor.

Als Beispiel ändern wir die Hintergrundfarbe von <q> auf Farbe azure.

<style type="text/css"><!--
  q { 
    background-color:azure;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Hintergrundfarbe auf #228b22 gesetzt wird.

<style type="text/css"><!--
  q: hover { 
    background-color: #228b22;
  }
//-->
</style>

Weiteres zum hier gezeigten HTML-Befehl q ist in der HTML Referenz bei <q> beschrieben.