Ressourcen: 137 HTML Farbnamen - Kombination von Farbe midnightblue und Farbwert #6495ed

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.

Hintergrundfarbe midnightblue			Schriftfarbwert #6495ed
Detail	:	Hintergrund midnightblue	Detail	:	Schrift #6495ed
Farbe	:	midnightblue	Farbwert	:	#6495ed
Farbwert	:	#191970	Farbe	:	cornflowerblue
HTML	:	midnightblue	HTML	:	#6495ed
HTML (Wert)	:	#191970	HTML (Wert)	:	#6495ed
CSS	:	midnightblue	CSS	:	#6495ed
CSS (Wert)	:	#191970	CSS (Wert)	:	#6495ed
CSS (kürzest)	:	#191970	CSS (kürzest)	:	#6495ed
CSS (RGB)	:	rgb(25,25,112)	CSS (RGB)	:	rgb(100,149,237)
CSS (%RGB)	:	rgb(9%,9%,43%)	CSS (%RGB)	:	rgb(39%,58%,92%)

Verlauf Hintergrundfarbe midnightblue nach Schriftfarbwert #6495ed
#191970	#232a81	#2e3c93	#394ea5	#435fb7	#4e71c9	#5983db	#6495ed
#191970	#232a81	#2e3c93	#394ea5	#435fb7	#4e71c9	#5983db	#6495ed

Kombination von midnightblue und #6495ed
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben #6495ed und midnightblue beträgt 76.22%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 23.78%. #6495ed ist nicht als Schriftfarbe auf Hintergrund midnightblue geeignet, da sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe midnightblue				Schriftfarbwert #6495ed
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#191970	#191970	#191970	#191970	#6495ed	#6495ed	#6495ed	#6495ed
#393984	#393984	#151560	#151560	#7aa4ef	#7aa4ef	#557fcb	#557fcb
#5a5a98	#5a5a98	#111150	#111150	#90b3f2	#90b3f2	#476aa9	#476aa9
#7b7bad	#7b7bad	#0e0e40	#0e0e40	#a6c2f4	#a6c2f4	#395587	#395587
#9c9cc1	#9c9cc1	#0a0a30	#0a0a30	#bcd1f7	#bcd1f7	#2a3f65	#2a3f65
#bdbdd6	#bdbdd6	#070720	#070720	#d2e0f9	#d2e0f9	#1c2a43	#1c2a43
#dedeea	#dedeea	#030310	#030310	#e8effc	#e8effc	#0e1521	#0e1521
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe midnightblue und Farbwert #6495ed

Wechsel der Hintergrundfarbe bei Hover mit Befehl thead

Die Hintergrundfarbe soll sich von Farbe midnightblue auf Farbwert #6495ed ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <thead> in Farbe midnightblue vor.

In diesem Beispiel legen wir Farbe midnightblue als Hintergrundfarbe von <thead> fest. Zwar behalten wir die Textfarbe bei, setzen jedoch die Schriftart auf sans-serif.

<style type="text/css"><!--
  thead { 
    background-color:midnightblue; 
    font-family:sans-serif;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Hintergrundfarbe auf #6495ed ändert.

<style type="text/css"><!--
  thead:hover { 
    background-color:#6495ed;
  }
//-->
</style>

Mehr zum Thema thead können Sie in Tabellen in HTML erfahren. Einzelheiten des Tag thead sind in der HTML Referenz bei <thead> ausführlich gezeigt.

Zebra-Effekt bei Tag th

Man redet vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Der Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <th> mit unterschiedlichen Hintergrundfarben Farbe midnightblue und Farbwert #6495ed.

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

Diese werden abwechselnd verwendet.

<table>
<tr><td class="ungerade">BA~A</td><td class="gerade">BB~A</td><td class="ungerade">BC~A</td></tr>
<tr><td class="ungerade">BA~B</td><td class="gerade">BB~B</td><td class="ungerade">BC~B</td></tr>
<tr><td class="ungerade">BA~C</td><td class="gerade">BB~C</td><td class="ungerade">BC~C</td></tr>
</table>

Mehr zu th können Sie in Tabellen in HTML nachsehen. Einzelheiten vom HTML-Befehl <th>.