Ressourcen: 120 HTML Farbnamen - Kombination von Farbe powderblue und Farbe cornsilk

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 powderblue			Schriftfarbe cornsilk
Detail	:	Hintergrund powderblue	Detail	:	Schrift cornsilk
Farbe	:	powderblue	Farbe	:	cornsilk
Farbwert	:	#b0e0e6	Farbwert	:	#fff8dc
HTML	:	powderblue	HTML	:	cornsilk
HTML (Wert)	:	#b0e0e6	HTML (Wert)	:	#fff8dc
CSS	:	powderblue	CSS	:	cornsilk
CSS (Wert)	:	#b0e0e6	CSS (Wert)	:	#fff8dc
CSS (kürzest)	:	#b0e0e6	CSS (kürzest)	:	#fff8dc
CSS (RGB)	:	rgb(176,224,230)	CSS (RGB)	:	rgb(255,248,220)
CSS (%RGB)	:	rgb(69%,87%,90%)	CSS (%RGB)	:	rgb(100%,97%,86%)

Verlauf Hintergrundfarbe powderblue nach Schriftfarbe cornsilk
#b0e0e6	#bbe3e4	#c6e6e3	#d1eae1	#ddede0	#e8f1de	#f3f4dd	#fff8dc
#b0e0e6	#bbe3e4	#c6e6e3	#d1eae1	#ddede0	#e8f1de	#f3f4dd	#fff8dc

Kombination von powderblue und cornsilk
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. 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 id velit ante.				Die Ähnlichkeit von cornsilk und powderblue beträgt 93.59%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 6.41%. Auf Hintergrund powderblue ist cornsilk ungeeignet. Sowohl Helligkeit als auch die Farben sind sich zu ähnlich.

Hintergrundfarbe powderblue				Schriftfarbe cornsilk
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#b0e0e6	#b0e0e6	#b0e0e6	#b0e0e6	#fff8dc	#fff8dc	#fff8dc	#fff8dc
#bbe4e9	#bbe4e9	#96c0c5	#96c0c5	#fff9e1	#fff9e1	#dad4bc	#dad4bc
#c6e8ed	#c6e8ed	#7da0a4	#7da0a4	#fffae6	#fffae6	#b6b19d	#b6b19d
#d1edf0	#d1edf0	#648083	#648083	#fffbeb	#fffbeb	#918d7d	#918d7d
#ddf1f4	#ddf1f4	#4b6062	#4b6062	#fffcf0	#fffcf0	#6d6a5e	#6d6a5e
#e8f6f7	#e8f6f7	#324041	#324041	#fffdf5	#fffdf5	#48463e	#48463e
#f3fafb	#f3fafb	#192020	#192020	#fffefa	#fffefa	#24231f	#24231f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe powderblue und Farbe cornsilk

Wechsel der Hintergrundfarbe bei Hover mit Tag pre

Die Hintergrundfarbe soll sich von Farbe powderblue auf Farbe cornsilk ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <pre> in Farbe powderblue vor.

Für dieses Beispiel ändern wir die Hintergrundfarbe von <pre> auf Farbe powderblue. Die Schriftgröße ändern wir auf 13px.

<style type="text/css"><!--
  pre { 
    font-size: 13px; 
    background-color: powderblue;
  }
//-->
</style>

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

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

Weiteres zu pre können Sie in Blockorientierte Elemente in HTML finden. Möglichkeiten vom hier genutzten Befehl <pre>.

Zebra-Effekt von Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man von einem so genannten Zebra-Effekt. Der Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .odd und .even für <tr> mit den Hintergrundfarben Farbe powderblue und Farbe cornsilk.

<style type="text/css"><!--
  tr.odd { 
    background-color: powderblue;
  }
  tr.even { 
    background-color: cornsilk;
  }
//-->
</style>

Diese werden abwechselnd genutzt.

<table>
<tr class="odd"><td>Pa:a</td><td>Pb:a</td><td>Pc:a</td></tr>
<tr class="even"><td>Pa:b</td><td>Pb:b</td><td>Pc:b</td></tr>
<tr class="odd"><td>Pa:c</td><td>Pb:c</td><td>Pc:c</td></tr>
</table>

Weiteres zum Thema können Sie in Tabellen in HTML lesen. Mehr zum Befehl <tr>.