Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #0000cd und Farbwert #ff4500

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 #0000cd			Schriftfarbwert #ff4500
Detail	:	Hintergrund #0000cd	Detail	:	Schrift #ff4500
Farbwert	:	#0000cd	Farbwert	:	#ff4500
Farbe	:	mediumblue	Farbe	:	orangered
HTML	:	#0000cd	HTML	:	#ff4500
HTML (Wert)	:	#0000cd	HTML (Wert)	:	#ff4500
CSS	:	#0000cd	CSS	:	#ff4500
CSS (Wert)	:	#0000cd	CSS (Wert)	:	#ff4500
CSS (kürzest)	:	#0000cd	CSS (kürzest)	:	#ff4500
CSS (RGB)	:	rgb(0,0,205)	CSS (RGB)	:	rgb(255,69,0)
CSS (%RGB)	:	rgb(0%,0%,80%)	CSS (%RGB)	:	rgb(100%,27%,0%)

Verlauf Hintergrundfarbwert #0000cd nach Schriftfarbwert #ff4500
#0000cd	#2409af	#481392	#6d1d75	#912757	#b6313a	#da3b1d	#ff4500
#0000cd	#2409af	#481392	#6d1d75	#912757	#b6313a	#da3b1d	#ff4500

Kombination von #0000cd und #ff4500
Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. 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. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit der Farben #ff4500 und #0000cd ergibt sich zu 84.55%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 15.45%. #ff4500 ist nicht als Schriftfarbe auf Hintergrund #0000cd geeignet, da sich die Helligkeiten zu ähnlich sind.

Hintergrundfarbwert #0000cd				Schriftfarbwert #ff4500
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#0000cd	#0000cd	#0000cd	#0000cd	#ff4500	#ff4500	#ff4500	#ff4500
#2424d4	#2424d4	#0000af	#0000af	#ff5f24	#ff5f24	#da3b00	#da3b00
#4848db	#4848db	#000092	#000092	#ff7a48	#ff7a48	#b63100	#b63100
#6d6de2	#6d6de2	#000075	#000075	#ff946d	#ff946d	#912700	#912700
#9191e9	#9191e9	#000057	#000057	#ffaf91	#ffaf91	#6d1d00	#6d1d00
#b6b6f0	#b6b6f0	#00003a	#00003a	#ffc9b6	#ffc9b6	#481300	#481300
#dadaf7	#dadaf7	#00001d	#00001d	#ffe4da	#ffe4da	#240900	#240900
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #0000cd und Farbwert #ff4500

Wechsel der Textfarbe bei Hover von Tag a

Mit HTML-Befehl <a> wird ein Hyperlink gesetzt. Dieser kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #0000cd auf Farbwert #ff4500 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <a> in Farbwert #0000cd vor.

Wir legen z.B. Farbwert #0000cd als Textfarbe von <a> fest.

<style type="text/css"><!--
  a { 
    color: #0000cd;
  }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Textfarbe zu #ff4500 ändert.

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

Weiteres zu a können Sie in Verweise und Protokolle in HTML finden. Die Beschreibung vom hier genutzten Tag a finden Sie in der HTML Referenz unter <a>.

Zebra-Effekt von Tag th

Man redet von einem so genannten Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Er unterstützt das Auge zum Beispiel die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <th> mit unterschiedlichen Hintergrundfarben Farbwert #0000cd und Farbwert #ff4500.

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

Diese CSS-Klassen werden dann abwechselnd genutzt.

<table>
<tr><td class="ungerade">R1/1</td><td class="gerade">R2/1</td><td class="ungerade">R3/1</td></tr>
<tr><td class="ungerade">R1/2</td><td class="gerade">R2/2</td><td class="ungerade">R3/2</td></tr>
<tr><td class="ungerade">R1/3</td><td class="gerade">R2/3</td><td class="ungerade">R3/3</td></tr>
</table>

Weiteres zum Thema th können Sie in Tabellen in HTML lesen. Mehr zum HTML-Tag th ist in der HTML Referenz unter <th> genau beschrieben.