Ressourcen: 120 HTML Farbnamen - Kombination von Farbe coral und Farbwert #1e90ff

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 coral			Schriftfarbwert #1e90ff
Detail	:	Hintergrund coral	Detail	:	Schrift #1e90ff
Farbe	:	coral	Farbwert	:	#1e90ff
Farbwert	:	#ff7f50	Farbe	:	dodgerblue
HTML	:	coral	HTML	:	#1e90ff
HTML (Wert)	:	#ff7f50	HTML (Wert)	:	#1e90ff
CSS	:	coral	CSS	:	#1e90ff
CSS (Wert)	:	#ff7f50	CSS (Wert)	:	#1e90ff
CSS (kürzest)	:	#ff7f50	CSS (kürzest)	:	#1e90ff
CSS (RGB)	:	rgb(255,127,80)	CSS (RGB)	:	rgb(30,144,255)
CSS (%RGB)	:	rgb(100%,49%,31%)	CSS (%RGB)	:	rgb(11%,56%,100%)

Verlauf Hintergrundfarbe coral nach Schriftfarbwert #1e90ff
#ff7f50	#de8169	#be8382	#9e869b	#7e88b4	#5e8bcd	#3e8de6	#1e90ff
#ff7f50	#de8169	#be8382	#9e869b	#7e88b4	#5e8bcd	#3e8de6	#1e90ff

Kombination von coral und #1e90ff
Cras id velit ante. 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 vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Auf Hintergrund coral ist #1e90ff ungeeignet, da die Unterschiede in der Helligkeit und Farbe zu gering sind. Die Ähnlichkeit der Farben #1e90ff und coral beträgt 93.83%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 6.17%.

Hintergrundfarbe coral				Schriftfarbwert #1e90ff
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff7f50	#ff7f50	#ff7f50	#ff7f50	#1e90ff	#1e90ff	#1e90ff	#1e90ff
#ff9169	#ff9169	#da6c44	#da6c44	#3e9fff	#3e9fff	#197bda	#197bda
#ffa382	#ffa382	#b65a39	#b65a39	#5eafff	#5eafff	#1566b6	#1566b6
#ffb59b	#ffb59b	#91482d	#91482d	#7ebfff	#7ebfff	#115291	#115291
#ffc8b4	#ffc8b4	#6d3622	#6d3622	#9ecfff	#9ecfff	#0c3d6d	#0c3d6d
#ffdacd	#ffdacd	#482416	#482416	#bedfff	#bedfff	#082948	#082948
#ffece6	#ffece6	#24120b	#24120b	#deefff	#deefff	#041424	#041424
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe coral und Farbwert #1e90ff

Wechsel der Umrandung bei Hover bei HTML-Tag hr

Die Rahmenfarbe soll sich von Farbe coral auf Farbwert #1e90ff ändern, wenn man mit der Maus auf <hr> zeigt. Bereiten wir zunächst die Darstellung von <hr> in Farbe coral vor.

In diesem Beispiel umranden wir <hr> mit einem 4 Pixel dicken, herausstehenden Rahmen in Farbe coral.

<style type="text/css"><!--
  hr { 
    border-width: 4px; 
    border-style: outset; 
    border-color: coral;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Rahmenfarbe auf #1e90ff geändert wird.

<style type="text/css"><!--
  hr: hover { 
    border-color: #1e90ff;
  }
//-->
</style>

Weiteres zu hr können Sie in Grundlegende Gestaltungselemente in HTML finden. Weiteres zum Befehl hr lesen Sie in der HTML Referenz unter <hr>.

Zebra-Effekt mit Befehl th

Man redet von einem so genannten Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <th> mit unterschiedlichen Hintergrundfarben Farbe coral und Farbwert #1e90ff.

<style type="text/css"><!--
  th.ying { 
    background-color: coral;
  }
  th.yang { 
    background-color:#1e90ff;
  }
//-->
</style>

Diese werden abwechselnd angewendet.

<table>
<tr><td class="ying">Ka:a</td><td class="yang">Kb:a</td><td class="ying">Kc:a</td></tr>
<tr><td class="ying">Ka:b</td><td class="yang">Kb:b</td><td class="ying">Kc:b</td></tr>
<tr><td class="ying">Ka:c</td><td class="yang">Kb:c</td><td class="ying">Kc:c</td></tr>
</table>

Weiteres zum Thema th können Sie in Tabellen in HTML finden. Zur Beschreibung vom Tag <th>.