Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #fffff0 und Farbwert #d3d3d3

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 #fffff0			Schriftfarbwert #d3d3d3
Detail	:	Hintergrund #fffff0	Detail	:	Schrift #d3d3d3
Farbwert	:	#fffff0	Farbwert	:	#d3d3d3
Farbe	:	ivory	Farbe	:	lightgrey
HTML	:	#fffff0	HTML	:	#d3d3d3
HTML (Wert)	:	#fffff0	HTML (Wert)	:	#d3d3d3
CSS	:	#fffff0	CSS	:	#d3d3d3
CSS (Wert)	:	#fffff0	CSS (Wert)	:	#d3d3d3
CSS (kürzest)	:	#fffff0	CSS (kürzest)	:	#d3d3d3
CSS (RGB)	:	rgb(255,255,240)	CSS (RGB)	:	rgb(211,211,211)
CSS (%RGB)	:	rgb(100%,100%,94%)	CSS (%RGB)	:	rgb(82%,82%,82%)

Verlauf Hintergrundfarbwert #fffff0 nach Schriftfarbwert #d3d3d3
#fffff0	#f8f8eb	#f2f2e7	#ecece3	#e5e5df	#dfdfdb	#d9d9d7	#d3d3d3
#fffff0	#f8f8eb	#f2f2e7	#ecece3	#e5e5df	#dfdfdb	#d9d9d7	#d3d3d3

Kombination von #fffff0 und #d3d3d3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit der Farben #d3d3d3 und #fffff0 ergibt sich zu 92.93%. Die Lesbarkeit dieser Farbkombination liegt damit bei 7.07%. Auf Hintergrund #fffff0 ist #d3d3d3 ungeeignet. Sowohl Helligkeit als auch die Farben sind zu ähnlich.

Hintergrundfarbwert #fffff0				Schriftfarbwert #d3d3d3
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fffff0	#fffff0	#fffff0	#fffff0	#d3d3d3	#d3d3d3	#d3d3d3	#d3d3d3
#fffff2	#fffff2	#dadacd	#dadacd	#d9d9d9	#d9d9d9	#b4b4b4	#b4b4b4
#fffff4	#fffff4	#b6b6ab	#b6b6ab	#dfdfdf	#dfdfdf	#969696	#969696
#fffff6	#fffff6	#919189	#919189	#e5e5e5	#e5e5e5	#787878	#787878
#fffff8	#fffff8	#6d6d66	#6d6d66	#ececec	#ececec	#5a5a5a	#5a5a5a
#fffffa	#fffffa	#484844	#484844	#f2f2f2	#f2f2f2	#3c3c3c	#3c3c3c
#fffffc	#fffffc	#242422	#242422	#f8f8f8	#f8f8f8	#1e1e1e	#1e1e1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fffff0 und Farbwert #d3d3d3

Wechsel der Textfarbe bei Hover von Tag pre

Die Textfarbe soll sich von Farbwert #fffff0 auf Farbwert #d3d3d3 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <pre> in Farbwert #fffff0 vor.

Wir legen hier Farbwert #fffff0 als Textfarbe von <pre> fest. Zwar behalten wir die Hintergrundfarbe bei, setzen jedoch die Schriftart auf verdana und verkleinern die Größe der Schrift auf 84%:

<style type="text/css"><!--
  pre { 
    color:#fffff0; 
    font-family:verdana; 
    font-size:84%;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Textfarbe auf #d3d3d3 geändert wird.

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

Weiteres zum Thema können Sie in Blockorientierte Elemente in HTML finden. Die Beschreibung vom Tag pre lesen Sie in der HTML Referenz unter <pre>.

Text- und Unterstreichungsfarben bei Tag s

Für dieses Beispiel ändern wir die Textfarbe von <s> auf Farbwert #d3d3d3 und lassen die Hintergrundfarbe unverändert. Die Schriftart ändern wir auf monospace. Die Schriftgröße verkleinern wir auf 96%. Wir unterstreichen den Inhalt von <s> mit Hilfe eines herausstehenden Rahmens mit 3 Pixel Dicke in Farbwert #fffff0. In HTML ist dies nicht machbar. Wir nutzen daher CSS zur Formatierung.

<style type="text/css"><!--
  s { 
    border-bottom:3px outset #fffff0; 
    font-family:monospace; 
    font-size:96%; 
    color:#d3d3d3;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Mehr zu s finden Sie in Text in HTML. Die Beschreibung des Befehl s lesen Sie in der HTML Referenz unter <s>.