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

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			Schriftfarbe mediumorchid
Detail	:	Hintergrund #1e90ff	Detail	:	Schrift mediumorchid
Farbwert	:	#1e90ff	Farbe	:	mediumorchid
Farbe	:	dodgerblue	Farbwert	:	#ba55d3
HTML	:	#1e90ff	HTML	:	mediumorchid
HTML (Wert)	:	#1e90ff	HTML (Wert)	:	#ba55d3
CSS	:	#1e90ff	CSS	:	mediumorchid
CSS (Wert)	:	#1e90ff	CSS (Wert)	:	#ba55d3
CSS (kürzest)	:	#1e90ff	CSS (kürzest)	:	#ba55d3
CSS (RGB)	:	rgb(30,144,255)	CSS (RGB)	:	rgb(186,85,211)
CSS (%RGB)	:	rgb(11%,56%,100%)	CSS (%RGB)	:	rgb(72%,33%,82%)

Verlauf Hintergrundfarbwert #1e90ff nach Schriftfarbe mediumorchid
#1e90ff	#3487f8	#4a7ff2	#6076ec	#776ee5	#8d65df	#a35dd9	#ba55d3
#1e90ff	#3487f8	#4a7ff2	#6076ec	#776ee5	#8d65df	#a35dd9	#ba55d3

Kombination von #1e90ff und mediumorchid
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit der Farben mediumorchid und #1e90ff beträgt 94.20%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.80%. mediumorchid ist nicht als Schriftfarbe auf Hintergrund #1e90ff geeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied gross genug sind.

Hintergrundfarbwert #1e90ff				Schriftfarbe mediumorchid
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#1e90ff	#1e90ff	#1e90ff	#1e90ff	#ba55d3	#ba55d3	#ba55d3	#ba55d3
#3e9fff	#3e9fff	#197bda	#197bda	#c36dd9	#c36dd9	#9f48b4	#9f48b4
#5eafff	#5eafff	#1566b6	#1566b6	#cd85df	#cd85df	#843c96	#843c96
#7ebfff	#7ebfff	#115291	#115291	#d79de5	#d79de5	#6a3078	#6a3078
#9ecfff	#9ecfff	#0c3d6d	#0c3d6d	#e1b6ec	#e1b6ec	#4f245a	#4f245a
#bedfff	#bedfff	#082948	#082948	#ebcef2	#ebcef2	#35183c	#35183c
#deefff	#deefff	#041424	#041424	#f5e6f8	#f5e6f8	#1a0c1e	#1a0c1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #1e90ff und Farbe mediumorchid

Zebra-Effekt bei Befehl td

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man von einem so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <td> mit unterschiedlichen Hintergrundfarben Farbwert #1e90ff und Farbe mediumorchid.

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

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr><td class="ung">Ea~a</td><td class="ger">Eb~a</td><td class="ung">Ec~a</td></tr>
<tr><td class="ung">Ea~b</td><td class="ger">Eb~b</td><td class="ung">Ec~b</td></tr>
<tr><td class="ung">Ea~c</td><td class="ger">Eb~c</td><td class="ung">Ec~c</td></tr>
</table>

Weiteres zu td lesen Sie in Tabellen in HTML. Mehr zum hier verwendeten Befehl <td>.

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag em

Die Hintergrundfarbe soll sich von Farbwert #1e90ff auf Farbe mediumorchid ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <em> in Farbwert #1e90ff vor.

Als Beispiel legen wir Farbwert #1e90ff als Hintergrundfarbe von <em> fest. Die Textfarbe lassen wir unverändert, ändern jedoch die Schriftart auf courier new:

<style type="text/css"><!--
  em { 
    font-family: courier new; 
    background-color: #1e90ff;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Hintergrundfarbe zu mediumorchid ändert.

<style type="text/css"><!--
  em: hover { 
    background-color: mediumorchid;
  }
//-->
</style>

Weiteres zum Thema em können Sie in Text in HTML nachlesen. Der Befehl em ist in der HTML Referenz bei <em> zusammengestellt.