Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ffe4b5 und Farbwert #708090

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 #ffe4b5			Schriftfarbwert #708090
Detail	:	Hintergrund #ffe4b5	Detail	:	Schrift #708090
Farbwert	:	#ffe4b5	Farbwert	:	#708090
Farbe	:	moccasin	Farbe	:	slategray
HTML	:	#ffe4b5	HTML	:	#708090
HTML (Wert)	:	#ffe4b5	HTML (Wert)	:	#708090
CSS	:	#ffe4b5	CSS	:	#708090
CSS (Wert)	:	#ffe4b5	CSS (Wert)	:	#708090
CSS (kürzest)	:	#ffe4b5	CSS (kürzest)	:	#708090
CSS (RGB)	:	rgb(255,228,181)	CSS (RGB)	:	rgb(112,128,144)
CSS (%RGB)	:	rgb(100%,89%,70%)	CSS (%RGB)	:	rgb(43%,50%,56%)

Verlauf Hintergrundfarbwert #ffe4b5 nach Schriftfarbwert #708090
#ffe4b5	#ead5af	#d6c7aa	#c1b9a5	#adaa9f	#989c9a	#848e95	#708090
#ffe4b5	#ead5af	#d6c7aa	#c1b9a5	#adaa9f	#989c9a	#848e95	#708090

Kombination von #ffe4b5 und #708090
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.				#708090 eignet sich nicht als Schriftfarbe auf Hintergrund #ffe4b5. Sowohl Helligkeit als auch die Farben sind zu ähnlich. Die Ähnlichkeit der Farben #708090 und #ffe4b5 ergibt sich zu 84.35%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 15.65%.

Hintergrundfarbwert #ffe4b5				Schriftfarbwert #708090
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffe4b5	#ffe4b5	#ffe4b5	#ffe4b5	#708090	#708090	#708090	#708090
#ffe7bf	#ffe7bf	#dac39b	#dac39b	#84929f	#84929f	#606d7b	#606d7b
#ffebca	#ffebca	#b6a281	#b6a281	#98a4af	#98a4af	#505b66	#505b66
#ffefd4	#ffefd4	#918267	#918267	#adb6bf	#adb6bf	#404952	#404952
#fff3df	#fff3df	#6d614d	#6d614d	#c1c8cf	#c1c8cf	#30363d	#30363d
#fff7e9	#fff7e9	#484133	#484133	#d6dadf	#d6dadf	#202429	#202429
#fffbf4	#fffbf4	#242019	#242019	#eaecef	#eaecef	#101214	#101214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffe4b5 und Farbwert #708090

Zebra-Effekt bei Befehl th

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Er unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <th> mit den Hintergrundfarben Farbwert #ffe4b5 und Farbwert #708090.

<style type="text/css"><!--
  th.ungerade { 
    background-color: #ffe4b5;
  }
  th.gerade { 
    background-color: #708090;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd angewendet.

<table>
<tr><td class="ungerade">LA/A</td><td class="gerade">LB/A</td><td class="ungerade">LC/A</td></tr>
<tr><td class="ungerade">LA/B</td><td class="gerade">LB/B</td><td class="ungerade">LC/B</td></tr>
<tr><td class="ungerade">LA/C</td><td class="gerade">LB/C</td><td class="ungerade">LC/C</td></tr>
</table>

Weiteres zum Thema th können Sie in Tabellen in HTML erfahren. Der Befehl th ist in der HTML Referenz unter <th> genau zusammengestellt.

Wechsel der Unterstreichung bei Hover bei HTML-Tag var

Die Unterstreichungsfarbe soll sich von Farbwert #ffe4b5 auf Farbwert #708090 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <var> in Farbwert #ffe4b5 vor.

Hier unterstreichen wir <var> mit einem doppelten Rahmen mit 4 Pixel Dicke in Farbwert #ffe4b5.

<style type="text/css"><!--
  var { 
    border-bottom-color:#ffe4b5; 
    border-bottom-width:4px; 
    border-bottom-style:double;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Unterstreichungsfarbe auf #708090 gesetzt wird.

<style type="text/css"><!--
  var:hover { 
    border-bottom-color:#708090;
  }
//-->
</style>

Die Idee ist dabei, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu verwenden. Öfter sehen Sie das bei Hyperlinks. Der Text wird in einer Farbe dargestellt. Und die Unterstreichung in einer anderen. Dies ist aber keine "normale" Unterstreichung, der Text selbst hat gar keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Weiteres zu var können Sie in Text in HTML finden. Die Beschreibung vom Tag var lesen Sie in der HTML Referenz unter <var>.