Ressourcen: 120 HTML Farbnamen - Kombination von Farbe lightsalmon und Farbwert #f0e68c

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 lightsalmon			Schriftfarbwert #f0e68c
Detail	:	Hintergrund lightsalmon	Detail	:	Schrift #f0e68c
Farbe	:	lightsalmon	Farbwert	:	#f0e68c
Farbwert	:	#ffa07a	Farbe	:	khaki
HTML	:	lightsalmon	HTML	:	#f0e68c
HTML (Wert)	:	#ffa07a	HTML (Wert)	:	#f0e68c
CSS	:	lightsalmon	CSS	:	#f0e68c
CSS (Wert)	:	#ffa07a	CSS (Wert)	:	#f0e68c
CSS (kürzest)	:	#ffa07a	CSS (kürzest)	:	#f0e68c
CSS (RGB)	:	rgb(255,160,122)	CSS (RGB)	:	rgb(240,230,140)
CSS (%RGB)	:	rgb(100%,62%,47%)	CSS (%RGB)	:	rgb(94%,90%,54%)

Verlauf Hintergrundfarbe lightsalmon nach Schriftfarbwert #f0e68c
#ffa07a	#fcaa7c	#fab47f	#f8be81	#f6c884	#f4d286	#f2dc89	#f0e68c
#ffa07a	#fcaa7c	#fab47f	#f8be81	#f6c884	#f4d286	#f2dc89	#f0e68c

Kombination von lightsalmon und #f0e68c
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. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#f0e68c ist nicht als Schriftfarbe auf Hintergrund lightsalmon geeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit der Farben #f0e68c und lightsalmon beträgt 92.60%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 7.40%.

Hintergrundfarbe lightsalmon				Schriftfarbwert #f0e68c
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffa07a	#ffa07a	#ffa07a	#ffa07a	#f0e68c	#f0e68c	#f0e68c	#f0e68c
#ffad8d	#ffad8d	#da8968	#da8968	#f2e99c	#f2e99c	#cdc578	#cdc578
#ffbba0	#ffbba0	#b67257	#b67257	#f4edac	#f4edac	#aba464	#aba464
#ffc8b3	#ffc8b3	#915b45	#915b45	#f6f0bd	#f6f0bd	#898350	#898350
#ffd6c6	#ffd6c6	#6d4434	#6d4434	#f8f4cd	#f8f4cd	#66623c	#66623c
#ffe3d9	#ffe3d9	#482d22	#482d22	#faf7de	#faf7de	#444128	#444128
#fff1ec	#fff1ec	#241611	#241611	#fcfbee	#fcfbee	#222014	#222014
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe lightsalmon und Farbwert #f0e68c

Wechsel der Textfarbe bei Hover bei Befehl address

Die Textfarbe soll sich von Farbe lightsalmon auf Farbwert #f0e68c ändern, wenn man mit der Maus auf <address> zeigt. Bereiten wir zunächst eine Darstellung von <address> in Farbe lightsalmon vor.

Z.B. legen wir Farbe lightsalmon als Textfarbe von <address> fest. Zwar behalten wir die Hintergrundfarbe bei, setzen jedoch die Schriftart auf sans-serif und vergrößern die Schriftgröße auf 122%:

<style type="text/css"><!--
  address { 
    color:lightsalmon; 
    font-size:122%; 
    font-family:sans-serif;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Textfarbe auf #f0e68c geändert wird.

<style type="text/css"><!--
  address:hover { 
    color:#f0e68c;
  }
//-->
</style>

Mehr zum Thema finden Sie in Blockorientierte Elemente in HTML. Mehr zum hier genutzten Befehl <address>.

Zebra-Effekt mit Tag th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man von einem so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge zum Beispiel die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .even und .odd für <th> mit den Hintergrundfarben Farbe lightsalmon und Farbwert #f0e68c.

<style type="text/css"><!--
  th.even { 
    background-color: lightsalmon;
  }
  th.odd { 
    background-color: #f0e68c;
  }
//-->
</style>

Diese werden dann abwechselnd angewendet.

<table>
<tr><td class="even">W1:1</td><td class="odd">W2:1</td><td class="even">W3:1</td></tr>
<tr><td class="even">W1:2</td><td class="odd">W2:2</td><td class="even">W3:2</td></tr>
<tr><td class="even">W1:3</td><td class="odd">W2:3</td><td class="even">W3:3</td></tr>
</table>

Weiteres zum Thema können Sie in Tabellen in HTML lesen. Weiteres zum hier genutzten Befehl <th>.