Ressourcen: 120 HTML Farbnamen - Kombination von Farbe gold und Farbwert #4169e1

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 gold			Schriftfarbwert #4169e1
Detail	:	Hintergrund gold	Detail	:	Schrift #4169e1
Farbe	:	gold	Farbwert	:	#4169e1
Farbwert	:	#ffd700	Farbe	:	royalblue
HTML	:	gold	HTML	:	#4169e1
HTML (Wert)	:	#ffd700	HTML (Wert)	:	#4169e1
CSS	:	gold	CSS	:	#4169e1
CSS (Wert)	:	#ffd700	CSS (Wert)	:	#4169e1
CSS (kürzest)	:	#ffd700	CSS (kürzest)	:	#4169e1
CSS (RGB)	:	rgb(255,215,0)	CSS (RGB)	:	rgb(65,105,225)
CSS (%RGB)	:	rgb(100%,84%,0%)	CSS (%RGB)	:	rgb(25%,41%,88%)

Verlauf Hintergrundfarbe gold nach Schriftfarbwert #4169e1
#ffd700	#e3c720	#c8b740	#ada760	#929880	#7788a0	#5c78c0	#4169e1
#ffd700	#e3c720	#c8b740	#ada760	#929880	#7788a0	#5c78c0	#4169e1

Kombination von gold und #4169e1
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in.				#4169e1 eignet sich nicht als Schriftfarbe auf Hintergrund gold, da sich die Helligkeiten zu ähnlich sind. Die Ähnlichkeit der Farben #4169e1 und gold ergibt sich zu 83.54%. Die Lesbarkeit dieser Kombination liegt damit bei 16.46%.

Hintergrundfarbe gold				Schriftfarbwert #4169e1
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffd700	#ffd700	#ffd700	#ffd700	#4169e1	#4169e1	#4169e1	#4169e1
#ffdc24	#ffdc24	#dab800	#dab800	#5c7ee5	#5c7ee5	#375ac0	#375ac0
#ffe248	#ffe248	#b69900	#b69900	#7793e9	#7793e9	#2e4ba0	#2e4ba0
#ffe86d	#ffe86d	#917a00	#917a00	#92a9ed	#92a9ed	#253c80	#253c80
#ffed91	#ffed91	#6d5c00	#6d5c00	#adbef2	#adbef2	#1b2d60	#1b2d60
#fff3b6	#fff3b6	#483d00	#483d00	#c8d4f6	#c8d4f6	#121e40	#121e40
#fff9da	#fff9da	#241e00	#241e00	#e3e9fa	#e3e9fa	#090f20	#090f20
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gold und Farbwert #4169e1

Wechsel der Textfarbe bei Hover bei HTML-Befehl p

Die Textfarbe soll sich von Farbe gold auf Farbwert #4169e1 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <p> in Farbe gold vor.

Wir setzen zum Beispiel bei <p> die Textfarbe auf Farbe gold und ändern die Größe der Schrift auf 14px.

<style type="text/css"><!--
  p { 
    color:gold; 
    font-size:14px;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf #4169e1 gesetzt wird.

<style type="text/css"><!--
  p: hover { 
    color: #4169e1;
  }
//-->
</style>

Weiteres zum Thema finden Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum HTML-Tag p erfahren Sie in der HTML Referenz unter <p>.

Zebra-Effekt mit Tag th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man vom so genannten Zebra-Effekt. Er unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <th> mit den Hintergrundfarben Farbe gold und Farbwert #4169e1.

<style type="text/css"><!--
  th.ger { 
    background-color:gold;
  }
  th.ung { 
    background-color:#4169e1;
  }
//-->
</style>

Diese werden abwechselnd verwendet.

<table>
<tr><td class="ger">Q1,1</td><td class="ung">Q2,1</td><td class="ger">Q3,1</td></tr>
<tr><td class="ger">Q1,2</td><td class="ung">Q2,2</td><td class="ger">Q3,2</td></tr>
<tr><td class="ger">Q1,3</td><td class="ung">Q2,3</td><td class="ger">Q3,3</td></tr>
</table>

Weiteres zu th können Sie in Tabellen in HTML nachlesen. Der hier genutzte HTML-Tag th ist in der HTML Referenz bei <th> ausführlich zusammengestellt.