Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #ffff00 und Farbwert #faf0e6

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbwert #ffff00			Schriftfarbwert #faf0e6
Detail	:	Hintergrund #ffff00	Detail	:	Schrift #faf0e6
Farbwert	:	#ffff00	Farbwert	:	#faf0e6
Farbe	:	yellow	Farbe	:	linen
HTML	:	#ffff00	HTML	:	#faf0e6
HTML (Wert)	:	#ffff00	HTML (Wert)	:	#faf0e6
CSS	:	#ffff00	CSS	:	#faf0e6
CSS (Wert)	:	#ffff00	CSS (Wert)	:	#faf0e6
CSS (kürzest)	:	#ff0	CSS (kürzest)	:	#faf0e6
CSS (RGB)	:	rgb(255,255,0)	CSS (RGB)	:	rgb(250,240,230)
CSS (%RGB)	:	rgb(100%,100%,0%)	CSS (%RGB)	:	rgb(98%,94%,90%)

Verlauf Hintergrundfarbwert #ffff00 nach Schriftfarbwert #faf0e6
#ffff00	#fefc20	#fdfa41	#fcf862	#fcf683	#fbf4a4	#faf2c5	#faf0e6
#ffff00	#fefc20	#fdfa41	#fcf862	#fcf683	#fbf4a4	#faf2c5	#faf0e6

Kombination von #ffff00 und #faf0e6
Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante.				Auf Hintergrund #ffff00 ist #faf0e6 ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend. Die Ähnlichkeit von #faf0e6 und #ffff00 ergibt sich zu 95.01%. Die Lesbarkeit dieser Kombination liegt damit bei 4.99%.

Hintergrundfarbwert #ffff00				Schriftfarbwert #faf0e6
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffff00	#ffff00	#ffff00	#ffff00	#faf0e6	#faf0e6	#faf0e6	#faf0e6
#ffff24	#ffff24	#dada00	#dada00	#faf2e9	#faf2e9	#d6cdc5	#d6cdc5
#ffff48	#ffff48	#b6b600	#b6b600	#fbf4ed	#fbf4ed	#b2aba4	#b2aba4
#ffff6d	#ffff6d	#919100	#919100	#fcf6f0	#fcf6f0	#8e8983	#8e8983
#ffff91	#ffff91	#6d6d00	#6d6d00	#fcf8f4	#fcf8f4	#6b6662	#6b6662
#ffffb6	#ffffb6	#484800	#484800	#fdfaf7	#fdfaf7	#474441	#474441
#ffffda	#ffffda	#242400	#242400	#fefcfb	#fefcfb	#232220	#232220
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffff00 und Farbwert #faf0e6

Zebra-Effekt mit Befehl td

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man vom so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <td> mit unterschiedlichen Hintergrundfarben Farbwert #ffff00 und Farbwert #faf0e6.

<style type="text/css"><!--
  td.gerade { 
    background-color: #ffff00;
  }
  td.ungerade { 
    background-color:#faf0e6;
  }
//-->
</style>

Diese werden abwechselnd verwendet.

<table>
<tr><td class="gerade">U1.1</td><td class="ungerade">U2.1</td><td class="gerade">U3.1</td></tr>
<tr><td class="gerade">U1.2</td><td class="ungerade">U2.2</td><td class="gerade">U3.2</td></tr>
<tr><td class="gerade">U1.3</td><td class="ungerade">U2.3</td><td class="gerade">U3.3</td></tr>
</table>

Mehr zum Thema finden Sie in Tabellen in HTML. Zur Beschreibung vom HTML-Tag <td>.

Wechsel der Textfarbe bei Hover bei Befehl center

Die Textfarbe soll sich von Farbwert #ffff00 auf Farbwert #faf0e6 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <center> in Farbwert #ffff00 vor.

Wir legen in diesem Beispiel Farbwert #ffff00 als Textfarbe von <center> fest. Zwar ändern wir die Hintergrundfarbe nicht, setzen jedoch die Schriftart auf sans-serif und setzen die Größe der Schrift auf 13px.

<style type="text/css"><!--
  center { 
    font-family:sans-serif; 
    color:#ff0; 
    font-size:13px;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf #faf0e6 gesetzt wird.

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

Mehr zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum Befehl <center>.