Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #fdf5e6 und Farbe floralwhite

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 #fdf5e6			Schriftfarbe floralwhite
Detail	:	Hintergrund #fdf5e6	Detail	:	Schrift floralwhite
Farbwert	:	#fdf5e6	Farbe	:	floralwhite
Farbe	:	oldlace	Farbwert	:	#fffaf0
HTML	:	#fdf5e6	HTML	:	floralwhite
HTML (Wert)	:	#fdf5e6	HTML (Wert)	:	#fffaf0
CSS	:	#fdf5e6	CSS	:	floralwhite
CSS (Wert)	:	#fdf5e6	CSS (Wert)	:	#fffaf0
CSS (kürzest)	:	#fdf5e6	CSS (kürzest)	:	#fffaf0
CSS (RGB)	:	rgb(253,245,230)	CSS (RGB)	:	rgb(255,250,240)
CSS (%RGB)	:	rgb(99%,96%,90%)	CSS (%RGB)	:	rgb(100%,98%,94%)

Verlauf Hintergrundfarbwert #fdf5e6 nach Schriftfarbe floralwhite
#fdf5e6	#fdf5e7	#fdf6e8	#fdf7ea	#fef7eb	#fef8ed	#fef9ee	#fffaf0
#fdf5e6	#fdf5e7	#fdf6e8	#fdf7ea	#fef7eb	#fef8ed	#fef9ee	#fffaf0

Kombination von #fdf5e6 und floralwhite
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit von floralwhite und #fdf5e6 ergibt sich zu 95.04%. Die Lesbarkeit dieser Farbkombination liegt damit bei 4.96%. floralwhite ist nicht als Schriftfarbe auf Hintergrund #fdf5e6 geeignet. Die Helligkeit und Farben sind sich zu ähnlich.

Hintergrundfarbwert #fdf5e6				Schriftfarbe floralwhite
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fdf5e6	#fdf5e6	#fdf5e6	#fdf5e6	#fffaf0	#fffaf0	#fffaf0	#fffaf0
#fdf6e9	#fdf6e9	#d8d2c5	#d8d2c5	#fffaf2	#fffaf2	#dad6cd	#dad6cd
#fdf7ed	#fdf7ed	#b4afa4	#b4afa4	#fffbf4	#fffbf4	#b6b2ab	#b6b2ab
#fdf9f0	#fdf9f0	#908c83	#908c83	#fffcf6	#fffcf6	#918e89	#918e89
#fefaf4	#fefaf4	#6c6962	#6c6962	#fffcf8	#fffcf8	#6d6b66	#6d6b66
#fefcf7	#fefcf7	#484641	#484641	#fffdfa	#fffdfa	#484744	#484744
#fefdfb	#fefdfb	#242320	#242320	#fffefc	#fffefc	#242322	#242322
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fdf5e6 und Farbe floralwhite

Zebra-Effekt von Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man von einem Zebra-Effekt. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .odd und .even für <tr> mit den Hintergrundfarben Farbwert #fdf5e6 und Farbe floralwhite.

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

Diese Klassen werden dann abwechselnd verwendet.

<table>
<tr class="odd"><td>TA-A</td><td>TB-A</td><td>TC-A</td></tr>
<tr class="even"><td>TA-B</td><td>TB-B</td><td>TC-B</td></tr>
<tr class="odd"><td>TA-C</td><td>TB-C</td><td>TC-C</td></tr>
</table>

Mehr zum Thema finden Sie in Tabellen in HTML. Einzelheiten des hier verwendeten HTML-Tag tr sind in der HTML Referenz bei <tr> ausführlich zusammengestellt.

Wechsel der Umrandung bei Hover von Befehl h5

Eine Überschrift der 5. Stufe erzeugt man mit HTML-Tag <h5>. Diese kann man farblich gestalten und hervorheben.

Die Rahmenfarbe soll sich von Farbwert #fdf5e6 auf Farbe floralwhite ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <h5> in Farbwert #fdf5e6 vor.

In diesem Beispiel umranden wir <h5> mit einem 3 Pixel dicken, gezahnten Rahmen in Farbwert #fdf5e6.

<style type="text/css"><!--
  h5 { border:3px ridge #fdf5e6; }
//-->
</style>

Jetzt fordern wir, dass sich bei Hover die Rahmenfarbe auf floralwhite ändert.

<style type="text/css"><!--
  h5:hover { 
    border-color:floralwhite;
  }
//-->
</style>

Weiteres zu h5 finden Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des hier verwendeten Tag h5 sind in der HTML Referenz bei <h5> zusammengestellt.