Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #1e90ff und Farbwert #90ee90

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 #90ee90
Detail	:	Hintergrund #1e90ff	Detail	:	Schrift #90ee90
Farbwert	:	#1e90ff	Farbwert	:	#90ee90
Farbe	:	dodgerblue	Farbe	:	lightgreen
HTML	:	#1e90ff	HTML	:	#90ee90
HTML (Wert)	:	#1e90ff	HTML (Wert)	:	#90ee90
CSS	:	#1e90ff	CSS	:	#90ee90
CSS (Wert)	:	#1e90ff	CSS (Wert)	:	#90ee90
CSS (kürzest)	:	#1e90ff	CSS (kürzest)	:	#90ee90
CSS (RGB)	:	rgb(30,144,255)	CSS (RGB)	:	rgb(144,238,144)
CSS (%RGB)	:	rgb(11%,56%,100%)	CSS (%RGB)	:	rgb(56%,93%,56%)

Verlauf Hintergrundfarbwert #1e90ff nach Schriftfarbwert #90ee90
#1e90ff	#2e9def	#3eaadf	#4eb8cf	#5fc5bf	#6fd3af	#7fe09f	#90ee90
#1e90ff	#2e9def	#3eaadf	#4eb8cf	#5fc5bf	#6fd3af	#7fe09f	#90ee90

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

Hintergrundfarbwert #1e90ff				Schriftfarbwert #90ee90
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#1e90ff	#1e90ff	#1e90ff	#1e90ff	#90ee90	#90ee90	#90ee90	#90ee90
#3e9fff	#3e9fff	#197bda	#197bda	#9ff09f	#9ff09f	#7bcc7b	#7bcc7b
#5eafff	#5eafff	#1566b6	#1566b6	#aff2af	#aff2af	#66aa66	#66aa66
#7ebfff	#7ebfff	#115291	#115291	#bff5bf	#bff5bf	#528852	#528852
#9ecfff	#9ecfff	#0c3d6d	#0c3d6d	#cff7cf	#cff7cf	#3d663d	#3d663d
#bedfff	#bedfff	#082948	#082948	#dffadf	#dffadf	#294429	#294429
#deefff	#deefff	#041424	#041424	#effcef	#effcef	#142214	#142214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #1e90ff und Farbwert #90ee90

Wechsel der Umrandung bei Hover von Tag h2

Mit HTML-Befehl <h2> erzeugen Sie eine Überschrift. Diese kann man farblich gestalten.

Die Rahmenfarbe soll sich von Farbwert #1e90ff auf Farbwert #90ee90 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <h2> in Farbwert #1e90ff vor.

In diesem Beispiel umranden wir <h2> mit einem 5 Pixel dicken, gestrichelten Rahmen in Farbwert #1e90ff.

<style type="text/css"><!--
  h2 { border:5px dashed #1e90ff; }
//-->
</style>

Nun fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe zu #90ee90 ändert.

<style type="text/css"><!--
  h2: hover { 
    border-color: #90ee90;
  }
//-->
</style>

Weiteres zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des Tag <h2>.

Zebra-Effekt von HTML-Befehl tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man vom Zebra-Effekt. Der Effekt unterstützt das Auge zum Beispiel die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <tr> mit den Hintergrundfarben Farbwert #1e90ff und Farbwert #90ee90.

<style type="text/css"><!--
  tr.ger { 
    background-color:#1e90ff;
  }
  tr.ung { 
    background-color: #90ee90;
  }
//-->
</style>

Diese werden abwechselnd genutzt.

<table>
<tr class="ger"><td>SA:A</td><td>SB:A</td><td>SC:A</td></tr>
<tr class="ung"><td>SA:B</td><td>SB:B</td><td>SC:B</td></tr>
<tr class="ger"><td>SA:C</td><td>SB:C</td><td>SC:C</td></tr>
</table>

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