Ressourcen: 137 HTML Farbnamen - Kombination von Farbe whitesmoke und Farbe darkorange

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.

Hintergrundfarbe whitesmoke			Schriftfarbe darkorange
Detail	:	Hintergrund whitesmoke	Detail	:	Schrift darkorange
Farbe	:	whitesmoke	Farbe	:	darkorange
Farbwert	:	#f5f5f5	Farbwert	:	#ff8c00
HTML	:	whitesmoke	HTML	:	darkorange
HTML (Wert)	:	#f5f5f5	HTML (Wert)	:	#ff8c00
CSS	:	whitesmoke	CSS	:	darkorange
CSS (Wert)	:	#f5f5f5	CSS (Wert)	:	#ff8c00
CSS (kürzest)	:	#f5f5f5	CSS (kürzest)	:	#ff8c00
CSS (RGB)	:	rgb(245,245,245)	CSS (RGB)	:	rgb(255,140,0)
CSS (%RGB)	:	rgb(96%,96%,96%)	CSS (%RGB)	:	rgb(100%,54%,0%)

Verlauf Hintergrundfarbe whitesmoke nach Schriftfarbe darkorange
#f5f5f5	#f6e6d2	#f7d7af	#f9c88c	#fab969	#fcaa46	#fd9b23	#ff8c00
#f5f5f5	#f6e6d2	#f7d7af	#f9c88c	#fab969	#fcaa46	#fd9b23	#ff8c00

Kombination von whitesmoke und darkorange
Cras id velit ante. 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 vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Auf Hintergrund whitesmoke ist darkorange ungeeignet, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind. Die Ähnlichkeit von darkorange und whitesmoke beträgt 89.81%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 10.19%.

Hintergrundfarbe whitesmoke				Schriftfarbe darkorange
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f5f5f5	#f5f5f5	#f5f5f5	#f5f5f5	#ff8c00	#ff8c00	#ff8c00	#ff8c00
#f6f6f6	#f6f6f6	#d2d2d2	#d2d2d2	#ff9c24	#ff9c24	#da7800	#da7800
#f7f7f7	#f7f7f7	#afafaf	#afafaf	#ffac48	#ffac48	#b66400	#b66400
#f9f9f9	#f9f9f9	#8c8c8c	#8c8c8c	#ffbd6d	#ffbd6d	#915000	#915000
#fafafa	#fafafa	#696969	#696969	#ffcd91	#ffcd91	#6d3c00	#6d3c00
#fcfcfc	#fcfcfc	#464646	#464646	#ffdeb6	#ffdeb6	#482800	#482800
#fdfdfd	#fdfdfd	#232323	#232323	#ffeeda	#ffeeda	#241400	#241400
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe whitesmoke und Farbe darkorange

Wechsel der Textfarbe bei Hover von Befehl blockquote

Die Textfarbe soll sich von Farbe whitesmoke auf Farbe darkorange ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <blockquote> in Farbe whitesmoke vor.

Wir ändern für dieses Beispiel die Textfarbe von <blockquote> auf Farbe whitesmoke. Die Hintergrundfarbe lassen wir unverändert, ändern jedoch die Schriftart auf sans-serif und ändern die Schriftgröße auf 9px:

<style type="text/css"><!--
  blockquote { 
    color: whitesmoke; 
    font-family: sans-serif; 
    font-size: 9px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Textfarbe auf darkorange gesetzt wird.

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

Mehr zum Thema blockquote können Sie in Blockorientierte Elemente in HTML nachlesen. Einzelheiten des HTML-Tag blockquote lesen Sie in der HTML Referenz unter <blockquote>.

Wechsel der Hintergrundfarbe bei Hover bei Tag colgroup

Die Hintergrundfarbe soll sich von Farbe whitesmoke auf Farbe darkorange ändern, wenn man mit der Maus auf <colgroup> zeigt. Bereiten wir zunächst eine Formatierung von <colgroup> in Farbe whitesmoke vor.

Wir legen zum Beispiel Farbe whitesmoke als Hintergrundfarbe von <colgroup> fest und setzen die Größe der Schrift auf 13pt:

<style type="text/css"><!--
  colgroup { 
    font-size:13pt; 
    background-color:whitesmoke;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf darkorange geändert wird.

<style type="text/css"><!--
  colgroup: hover { 
    background-color: darkorange;
  }
//-->
</style>

Weiteres zu colgroup können Sie in Tabellen in HTML erfahren. Die Beschreibung vom hier gezeigten Befehl colgroup lesen Sie in der HTML Referenz unter <colgroup>.