Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #1e90ff und Farbwert #483d8b

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.

Hintergrundfarbwert #1e90ff			Schriftfarbwert #483d8b
Detail	:	Hintergrund #1e90ff	Detail	:	Schrift #483d8b
Farbwert	:	#1e90ff	Farbwert	:	#483d8b
Farbe	:	dodgerblue	Farbe	:	darkslateblue
HTML	:	#1e90ff	HTML	:	#483d8b
HTML (Wert)	:	#1e90ff	HTML (Wert)	:	#483d8b
CSS	:	#1e90ff	CSS	:	#483d8b
CSS (Wert)	:	#1e90ff	CSS (Wert)	:	#483d8b
CSS (kürzest)	:	#1e90ff	CSS (kürzest)	:	#483d8b
CSS (RGB)	:	rgb(30,144,255)	CSS (RGB)	:	rgb(72,61,139)
CSS (%RGB)	:	rgb(11%,56%,100%)	CSS (%RGB)	:	rgb(28%,23%,54%)

Verlauf Hintergrundfarbwert #1e90ff nach Schriftfarbwert #483d8b
#1e90ff	#2484ee	#2a78dd	#306ccd	#3660bc	#3c54ac	#42489b	#483d8b
#1e90ff	#2484ee	#2a78dd	#306ccd	#3660bc	#3c54ac	#42489b	#483d8b

Kombination von #1e90ff und #483d8b
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. Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#483d8b eignet sich nicht als Schriftfarbe auf Hintergrund #1e90ff, da die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit der Farben #483d8b und #1e90ff beträgt 86.66%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 13.34%.

Hintergrundfarbwert #1e90ff				Schriftfarbwert #483d8b
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#1e90ff	#1e90ff	#1e90ff	#1e90ff	#483d8b	#483d8b	#483d8b	#483d8b
#3e9fff	#3e9fff	#197bda	#197bda	#62589b	#62589b	#3d3477	#3d3477
#5eafff	#5eafff	#1566b6	#1566b6	#7c74ac	#7c74ac	#332b63	#332b63
#7ebfff	#7ebfff	#115291	#115291	#9690bc	#9690bc	#29224f	#29224f
#9ecfff	#9ecfff	#0c3d6d	#0c3d6d	#b0abcd	#b0abcd	#1e1a3b	#1e1a3b
#bedfff	#bedfff	#082948	#082948	#cac7dd	#cac7dd	#141127	#141127
#deefff	#deefff	#041424	#041424	#e4e3ee	#e4e3ee	#0a0813	#0a0813
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #1e90ff und Farbwert #483d8b

Zebra-Effekt mit Tag td

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Dieser Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <td> mit unterschiedlichen Hintergrundfarben Farbwert #1e90ff und Farbwert #483d8b.

<style type="text/css"><!--
  td.gerade { 
    background-color: #1e90ff;
  }
  td.ungerade { 
    background-color: #483d8b;
  }
//-->
</style>

Diese Klassen werden abwechselnd genutzt.

<table>
<tr><td class="gerade">WA-A</td><td class="ungerade">WB-A</td><td class="gerade">WC-A</td></tr>
<tr><td class="gerade">WA-B</td><td class="ungerade">WB-B</td><td class="gerade">WC-B</td></tr>
<tr><td class="gerade">WA-C</td><td class="ungerade">WB-C</td><td class="gerade">WC-C</td></tr>
</table>

Weiteres zu td können Sie in Tabellen in HTML erfahren. Weiteres zum hier gezeigten HTML-Befehl td ist in der HTML Referenz bei <td> genau zusammengestellt.

Wechsel der Umrandung bei Hover von HTML-Befehl del

Die Rahmenfarbe soll sich von Farbwert #1e90ff auf Farbwert #483d8b ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <del> in Farbwert #1e90ff vor.

In diesem Beispiel umranden wir <del> mit einem 3 Pixel dicken, einfallenden Rahmen in Farbwert #1e90ff.

<style type="text/css"><!--
  del { 
    border-style:inset; 
    border-width:3px; 
    border-color:#1e90ff;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Mausberührung die Rahmenfarbe zu #483d8b ändert.

<style type="text/css"><!--
  del:hover { 
    border-color:#483d8b;
  }
//-->
</style>

Weiteres zum hier gezeigten Tag del erfahren Sie in der HTML Referenz unter <del>.