Ressourcen: 120 HTML Farbnamen - Kombination von Farbe skyblue und Farbwert #006400

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 skyblue			Schriftfarbwert #006400
Detail	:	Hintergrund skyblue	Detail	:	Schrift #006400
Farbe	:	skyblue	Farbwert	:	#006400
Farbwert	:	#87ceeb	Farbe	:	darkgreen
HTML	:	skyblue	HTML	:	#006400
HTML (Wert)	:	#87ceeb	HTML (Wert)	:	#006400
CSS	:	skyblue	CSS	:	#006400
CSS (Wert)	:	#87ceeb	CSS (Wert)	:	#006400
CSS (kürzest)	:	#87ceeb	CSS (kürzest)	:	#006400
CSS (RGB)	:	rgb(135,206,235)	CSS (RGB)	:	rgb(0,100,0)
CSS (%RGB)	:	rgb(52%,80%,92%)	CSS (%RGB)	:	rgb(0%,39%,0%)

Verlauf Hintergrundfarbe skyblue nach Schriftfarbwert #006400
#87ceeb	#73bec9	#60afa7	#4da086	#399164	#268243	#137321	#006400
#87ceeb	#73bec9	#60afa7	#4da086	#399164	#268243	#137321	#006400

Kombination von skyblue und #006400
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. 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 id velit ante.				Die Ähnlichkeit der Farben #006400 und skyblue beträgt 79.66%. Die Lesbarkeit dieser Kombination bewerte ich mit 20.34%. #006400 ist nicht als Schriftfarbe auf Hintergrund skyblue geeignet, da der Farbunterschied zu gering ist

Hintergrundfarbe skyblue				Schriftfarbwert #006400
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#87ceeb	#87ceeb	#87ceeb	#87ceeb	#006400	#006400	#006400	#006400
#98d5ed	#98d5ed	#73b0c9	#73b0c9	#247a24	#247a24	#005500	#005500
#a9dcf0	#a9dcf0	#6093a7	#6093a7	#489048	#489048	#004700	#004700
#bae3f3	#bae3f3	#4d7586	#4d7586	#6da66d	#6da66d	#003900	#003900
#cbeaf6	#cbeaf6	#395864	#395864	#91bc91	#91bc91	#002a00	#002a00
#dcf1f9	#dcf1f9	#263a43	#263a43	#b6d2b6	#b6d2b6	#001c00	#001c00
#edf8fc	#edf8fc	#131d21	#131d21	#dae8da	#dae8da	#000e00	#000e00
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe skyblue und Farbwert #006400

Zebra-Effekt bei Tag th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man von einem so genannten Zebra-Effekt. Der Effekt unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <th> mit den Hintergrundfarben Farbe skyblue und Farbwert #006400.

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

Diese CSS-Klassen werden abwechselnd verwendet.

<table>
<tr><td class="ungerade">UA.A</td><td class="gerade">UB.A</td><td class="ungerade">UC.A</td></tr>
<tr><td class="ungerade">UA.B</td><td class="gerade">UB.B</td><td class="ungerade">UC.B</td></tr>
<tr><td class="ungerade">UA.C</td><td class="gerade">UB.C</td><td class="ungerade">UC.C</td></tr>
</table>

Mehr zum Thema können Sie in Tabellen in HTML nachsehen. Die Beschreibung vom hier verwendeten Befehl th finden Sie in der HTML Referenz unter <th>.

Wechsel der Hintergrundfarbe bei Hover von Tag h5

Mit Tag <h5> wird eine Überschrift erzeugt. Diese kann man hervorheben und farblich gestalten.

Die Hintergrundfarbe soll sich von Farbe skyblue auf Farbwert #006400 ändern, wenn man mit der Maus auf <h5> zeigt. Wir bereiten zunächst die Formatierung von <h5> in Farbe skyblue vor.

Wir legen hier Farbe skyblue als Hintergrundfarbe von <h5> fest:

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

Jetzt fordern wir, dass bei Hover die Hintergrundfarbe auf #006400 geändert wird.

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

Weiteres zu h5 können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Weiteres zum hier genutzten Befehl h5 ist in der HTML Referenz unter <h5> ausführlich gezeigt.