Ressourcen: 120 HTML Farbnamen - Kombination von Farbe olivedrab und Farbwert #90ee90

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 olivedrab			Schriftfarbwert #90ee90
Detail	:	Hintergrund olivedrab	Detail	:	Schrift #90ee90
Farbe	:	olivedrab	Farbwert	:	#90ee90
Farbwert	:	#6b8e23	Farbe	:	lightgreen
HTML	:	olivedrab	HTML	:	#90ee90
HTML (Wert)	:	#6b8e23	HTML (Wert)	:	#90ee90
CSS	:	olivedrab	CSS	:	#90ee90
CSS (Wert)	:	#6b8e23	CSS (Wert)	:	#90ee90
CSS (kürzest)	:	#6b8e23	CSS (kürzest)	:	#90ee90
CSS (RGB)	:	rgb(107,142,35)	CSS (RGB)	:	rgb(144,238,144)
CSS (%RGB)	:	rgb(41%,55%,13%)	CSS (%RGB)	:	rgb(56%,93%,56%)

Verlauf Hintergrundfarbe olivedrab nach Schriftfarbwert #90ee90
#6b8e23	#709b32	#75a942	#7ab751	#80c461	#85d270	#8ae080	#90ee90
#6b8e23	#709b32	#75a942	#7ab751	#80c461	#85d270	#8ae080	#90ee90

Kombination von olivedrab und #90ee90
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Auf Hintergrund olivedrab ist #90ee90 ungeeignet, weil sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit von #90ee90 und olivedrab beträgt 87.21%. Die Lesbarkeit dieser Farbkombination liegt damit bei 12.79%.

Hintergrundfarbe olivedrab				Schriftfarbwert #90ee90
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6b8e23	#6b8e23	#6b8e23	#6b8e23	#90ee90	#90ee90	#90ee90	#90ee90
#809e42	#809e42	#5b791e	#5b791e	#9ff09f	#9ff09f	#7bcc7b	#7bcc7b
#95ae61	#95ae61	#4c6519	#4c6519	#aff2af	#aff2af	#66aa66	#66aa66
#aabe81	#aabe81	#3d5114	#3d5114	#bff5bf	#bff5bf	#528852	#528852
#bfcea0	#bfcea0	#2d3c0f	#2d3c0f	#cff7cf	#cff7cf	#3d663d	#3d663d
#d4dec0	#d4dec0	#1e280a	#1e280a	#dffadf	#dffadf	#294429	#294429
#e9eedf	#e9eedf	#0f1405	#0f1405	#effcef	#effcef	#142214	#142214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe olivedrab und Farbwert #90ee90

Wechsel der Umrandung bei Hover bei HTML-Tag acronym

Die Rahmenfarbe soll sich von Farbe olivedrab auf Farbwert #90ee90 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <acronym> in Farbe olivedrab vor.

In diesem Beispiel umranden wir <acronym> mit einem 3 Pixel dicken, herausstehenden Rahmen in Farbe olivedrab.

<style type="text/css"><!--
  acronym { 
    border-width: 3px; 
    border-style: outset; 
    border-color: olivedrab;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Rahmenfarbe auf #90ee90 geändert wird.

<style type="text/css"><!--
  acronym:hover { 
    border-color:#90ee90;
  }
//-->
</style>

Möglichkeiten vom hier gezeigten Tag acronym sind in der HTML Referenz bei <acronym> genau zusammengestellt.

Zebra-Effekt von Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man von einem so genannten Zebra-Effekt. Der Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <tr> mit unterschiedlichen Hintergrundfarben Farbe olivedrab und Farbwert #90ee90.

<style type="text/css"><!--
  tr.ying { 
    background-color: olivedrab;
  }
  tr.yang { 
    background-color:#90ee90;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd genutzt.

<table>
<tr class="ying"><td>Ka,a</td><td>Kb,a</td><td>Kc,a</td></tr>
<tr class="yang"><td>Ka,b</td><td>Kb,b</td><td>Kc,b</td></tr>
<tr class="ying"><td>Ka,c</td><td>Kb,c</td><td>Kc,c</td></tr>
</table>

Mehr zu tr finden Sie in Tabellen in HTML. Weiteres zum HTML-Tag tr ist in der HTML Referenz unter <tr> genau gezeigt.