Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #6b8e23 und Farbwert #006400

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 #6b8e23			Schriftfarbwert #006400
Detail	:	Hintergrund #6b8e23	Detail	:	Schrift #006400
Farbwert	:	#6b8e23	Farbwert	:	#006400
Farbe	:	olivedrab	Farbe	:	darkgreen
HTML	:	#6b8e23	HTML	:	#006400
HTML (Wert)	:	#6b8e23	HTML (Wert)	:	#006400
CSS	:	#6b8e23	CSS	:	#006400
CSS (Wert)	:	#6b8e23	CSS (Wert)	:	#006400
CSS (kürzest)	:	#6b8e23	CSS (kürzest)	:	#006400
CSS (RGB)	:	rgb(107,142,35)	CSS (RGB)	:	rgb(0,100,0)
CSS (%RGB)	:	rgb(41%,55%,13%)	CSS (%RGB)	:	rgb(0%,39%,0%)

Verlauf Hintergrundfarbwert #6b8e23 nach Schriftfarbwert #006400
#6b8e23	#5b881e	#4c8219	#3d7c14	#2d760f	#1e700a	#0f6a05	#006400
#6b8e23	#5b881e	#4c8219	#3d7c14	#2d760f	#1e700a	#0f6a05	#006400

Kombination von #6b8e23 und #006400
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.				Die Ähnlichkeit der Farben #006400 und #6b8e23 ergibt sich zu 90.69%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 9.31%. Auf Hintergrund #6b8e23 ist #006400 ungeeignet, weil die Unterschiede in der Helligkeit und Farbe zu gering sind.

Hintergrundfarbwert #6b8e23				Schriftfarbwert #006400
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6b8e23	#6b8e23	#6b8e23	#6b8e23	#006400	#006400	#006400	#006400
#809e42	#809e42	#5b791e	#5b791e	#247a24	#247a24	#005500	#005500
#95ae61	#95ae61	#4c6519	#4c6519	#489048	#489048	#004700	#004700
#aabe81	#aabe81	#3d5114	#3d5114	#6da66d	#6da66d	#003900	#003900
#bfcea0	#bfcea0	#2d3c0f	#2d3c0f	#91bc91	#91bc91	#002a00	#002a00
#d4dec0	#d4dec0	#1e280a	#1e280a	#b6d2b6	#b6d2b6	#001c00	#001c00
#e9eedf	#e9eedf	#0f1405	#0f1405	#dae8da	#dae8da	#000e00	#000e00
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #6b8e23 und Farbwert #006400

Wechsel der Textfarbe bei Hover von HTML-Tag button

Die Textfarbe soll sich von Farbwert #6b8e23 auf Farbwert #006400 ändern, wenn man mit der Maus auf <button> zeigt. Bereiten wir zunächst die Darstellung von <button> in Farbwert #6b8e23 vor.

Als Beispiel legen wir Farbwert #6b8e23 als Textfarbe von <button> fest:

<style type="text/css"><!--
  button { 
    color:#6b8e23;
  }
//-->
</style>

Nun fordern wir, dass sich bei Berührung mit der Maus die Textfarbe auf #006400 ändert.

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

Mehr zum Thema können Sie in Formulare in HTML erfahren. Weiteres zum Befehl <button>.

Zebra-Effekt mit HTML-Tag td

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man von einem Zebra-Effekt. Er unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <td> mit unterschiedlichen Hintergrundfarben Farbwert #6b8e23 und Farbwert #006400.

<style type="text/css"><!--
  td.gerade { 
    background-color: #6b8e23;
  }
  td.ungerade { 
    background-color: #006400;
  }
//-->
</style>

Diese werden abwechselnd angewendet.

<table>
<tr><td class="gerade"><tt>A:A</td><td class="ungerade"></tt>B:A</td><td class="gerade"><tt>C:A</td></tr>
<tr><td class="gerade"></tt>A:B</td><td class="ungerade"><tt>B:B</td><td class="gerade"></tt>C:B</td></tr>
<tr><td class="gerade"><tt>A:C</td><td class="ungerade"></tt>B:C</td><td class="gerade">@C:C</td></tr>
</table>

Weiteres zum Thema erfahren Sie in Tabellen in HTML. Einzelheiten vom hier genutzten HTML-Tag td lesen Sie in der HTML Referenz unter <td>.