Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ff69b4 und Farbe beige

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 #ff69b4			Schriftfarbe beige
Detail	:	Hintergrund #ff69b4	Detail	:	Schrift beige
Farbwert	:	#ff69b4	Farbe	:	beige
Farbe	:	hotpink	Farbwert	:	#f5f5dc
HTML	:	#ff69b4	HTML	:	beige
HTML (Wert)	:	#ff69b4	HTML (Wert)	:	#f5f5dc
CSS	:	#ff69b4	CSS	:	beige
CSS (Wert)	:	#ff69b4	CSS (Wert)	:	#f5f5dc
CSS (kürzest)	:	#ff69b4	CSS (kürzest)	:	#f5f5dc
CSS (RGB)	:	rgb(255,105,180)	CSS (RGB)	:	rgb(245,245,220)
CSS (%RGB)	:	rgb(100%,41%,70%)	CSS (%RGB)	:	rgb(96%,96%,86%)

Verlauf Hintergrundfarbwert #ff69b4 nach Schriftfarbe beige
#ff69b4	#fd7db9	#fc91bf	#faa5c5	#f9b9ca	#f7cdd0	#f6e1d6	#f5f5dc
#ff69b4	#fd7db9	#fc91bf	#faa5c5	#f9b9ca	#f7cdd0	#f6e1d6	#f5f5dc

Kombination von #ff69b4 und beige
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.				Auf Hintergrund #ff69b4 ist beige ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind unzureichend. Die Ähnlichkeit der Farben beige und #ff69b4 beträgt 88.61%. Die Lesbarkeit dieser Kombination ergibt sich zu 11.39%.

Hintergrundfarbwert #ff69b4				Schriftfarbe beige
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff69b4	#ff69b4	#ff69b4	#ff69b4	#f5f5dc	#f5f5dc	#f5f5dc	#f5f5dc
#ff7ebe	#ff7ebe	#da5a9a	#da5a9a	#f6f6e1	#f6f6e1	#d2d2bc	#d2d2bc
#ff93c9	#ff93c9	#b64b80	#b64b80	#f7f7e6	#f7f7e6	#afaf9d	#afaf9d
#ffa9d4	#ffa9d4	#913c66	#913c66	#f9f9eb	#f9f9eb	#8c8c7d	#8c8c7d
#ffbede	#ffbede	#6d2d4d	#6d2d4d	#fafaf0	#fafaf0	#69695e	#69695e
#ffd4e9	#ffd4e9	#481e33	#481e33	#fcfcf5	#fcfcf5	#46463e	#46463e
#ffe9f4	#ffe9f4	#240f19	#240f19	#fdfdfa	#fdfdfa	#23231f	#23231f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ff69b4 und Farbe beige

Zebra-Effekt von Tag td

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

<style type="text/css"><!--
  td.yang { 
    background-color: #ff69b4;
  }
  td.ying { 
    background-color: beige;
  }
//-->
</style>

Diese Klassen werden dann abwechselnd genutzt.

<table>
<tr><td class="yang">JA/A</td><td class="ying">JB/A</td><td class="yang">JC/A</td></tr>
<tr><td class="yang">JA/B</td><td class="ying">JB/B</td><td class="yang">JC/B</td></tr>
<tr><td class="yang">JA/C</td><td class="ying">JB/C</td><td class="yang">JC/C</td></tr>
</table>

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

Wechsel der Textfarbe bei Hover von HTML-Tag abbr

Die Textfarbe soll sich von Farbwert #ff69b4 auf Farbe beige ändern, wenn man mit der Maus auf <abbr> zeigt. Wir bereiten zunächst eine Darstellung von <abbr> in Farbwert #ff69b4 vor.

Wir legen z.B. Farbwert #ff69b4 als Textfarbe von <abbr> fest.

<style type="text/css"><!--
  abbr { 
    color: #ff69b4;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe auf beige ändert.

<style type="text/css"><!--
  abbr: hover { 
    color: beige;
  }
//-->
</style>

Einzelheiten des Tag abbr erfahren Sie in der HTML Referenz unter <abbr>.