Ressourcen: 120 HTML Farbnamen - Kombination von Farbe papayawhip und Farbwert #fff8dc

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 papayawhip			Schriftfarbwert #fff8dc
Detail	:	Hintergrund papayawhip	Detail	:	Schrift #fff8dc
Farbe	:	papayawhip	Farbwert	:	#fff8dc
Farbwert	:	#ffefd5	Farbe	:	cornsilk
HTML	:	papayawhip	HTML	:	#fff8dc
HTML (Wert)	:	#ffefd5	HTML (Wert)	:	#fff8dc
CSS	:	papayawhip	CSS	:	#fff8dc
CSS (Wert)	:	#ffefd5	CSS (Wert)	:	#fff8dc
CSS (kürzest)	:	#ffefd5	CSS (kürzest)	:	#fff8dc
CSS (RGB)	:	rgb(255,239,213)	CSS (RGB)	:	rgb(255,248,220)
CSS (%RGB)	:	rgb(100%,93%,83%)	CSS (%RGB)	:	rgb(100%,97%,86%)

Verlauf Hintergrundfarbe papayawhip nach Schriftfarbwert #fff8dc
#ffefd5	#fff0d6	#fff1d7	#fff2d8	#fff4d9	#fff5da	#fff6db	#fff8dc
#ffefd5	#fff0d6	#fff1d7	#fff2d8	#fff4d9	#fff5da	#fff6db	#fff8dc

Kombination von papayawhip und #fff8dc
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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#fff8dc ist nicht als Schriftfarbe auf Hintergrund papayawhip geeignet, weil sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit von #fff8dc und papayawhip ergibt sich zu 94.94%. Die Lesbarkeit dieser Kombination ergibt sich zu 5.06%.

Hintergrundfarbe papayawhip				Schriftfarbwert #fff8dc
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffefd5	#ffefd5	#ffefd5	#ffefd5	#fff8dc	#fff8dc	#fff8dc	#fff8dc
#fff1db	#fff1db	#daccb6	#daccb6	#fff9e1	#fff9e1	#dad4bc	#dad4bc
#fff3e1	#fff3e1	#b6aa98	#b6aa98	#fffae6	#fffae6	#b6b19d	#b6b19d
#fff5e7	#fff5e7	#918879	#918879	#fffbeb	#fffbeb	#918d7d	#918d7d
#fff8ed	#fff8ed	#6d665b	#6d665b	#fffcf0	#fffcf0	#6d6a5e	#6d6a5e
#fffaf3	#fffaf3	#48443c	#48443c	#fffdf5	#fffdf5	#48463e	#48463e
#fffcf9	#fffcf9	#24221e	#24221e	#fffefa	#fffefa	#24231f	#24231f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe papayawhip und Farbwert #fff8dc

Zebra-Effekt bei Befehl tr

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man vom so genannten Zebra-Effekt. Er unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .yang und .ying für <tr> mit den Hintergrundfarben Farbe papayawhip und Farbwert #fff8dc.

<style type="text/css"><!--
  tr.yang { 
    background-color:papayawhip;
  }
  tr.ying { 
    background-color: #fff8dc;
  }
//-->
</style>

Diese Klassen werden dann abwechselnd genutzt.

<table>
<tr class="yang"><td>Ha-a</td><td>Hb-a</td><td>Hc-a</td></tr>
<tr class="ying"><td>Ha-b</td><td>Hb-b</td><td>Hc-b</td></tr>
<tr class="yang"><td>Ha-c</td><td>Hb-c</td><td>Hc-c</td></tr>
</table>

Weiteres zum Thema tr können Sie in Tabellen in HTML erfahren. Weiteres zum HTML-Tag <tr>.

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag caption

Die Hintergrundfarbe soll sich von Farbe papayawhip auf Farbwert #fff8dc ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <caption> in Farbe papayawhip vor.

In diesem Beispiel legen wir bei <caption> die Hintergrundfarbe auf Farbe papayawhip fest und verringern die Schriftgröße auf 86%:

<style type="text/css"><!--
  caption { 
    font-size:86%; 
    background-color:papayawhip;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Hintergrundfarbe auf #fff8dc geändert wird.

<style type="text/css"><!--
  caption:hover { 
    background-color:#fff8dc;
  }
//-->
</style>

Mehr zum Thema caption finden Sie in Tabellen in HTML. Weiteres zum hier genutzten HTML-Tag <caption>.