Ressourcen: 16 Graustufen in HTML - Kombination von Farbe gray238 und Farbwert #ffffff

Graustufen enthalten insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 16 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 15 (d.h. hexadezimal 0 bis f) für r, g und b.

Hintergrundfarbe gray238			Schriftfarbwert #ffffff
Detail	:	Hintergrund gray238	Detail	:	Schrift #ffffff
Farbe	:	gray238	Farbwert	:	#ffffff
Farbwert	:	#eeeeee	Farbe	:	white
HTML	:	gray238	HTML	:	#ffffff
HTML (Wert)	:	#eeeeee	HTML (Wert)	:	#ffffff
CSS	:	gray238	CSS	:	#ffffff
CSS (Wert)	:	#eeeeee	CSS (Wert)	:	#ffffff
CSS (kürzest)	:	#eee	CSS (kürzest)	:	#fff
CSS (RGB)	:	rgb(238,238,238)	CSS (RGB)	:	rgb(255,255,255)
CSS (%RGB)	:	rgb(93%,93%,93%)	CSS (%RGB)	:	rgb(100%,100%,100%)

Verlauf Hintergrundfarbe gray238 nach Schriftfarbwert #ffffff
#eeeeee	#f0f0f0	#f2f2f2	#f5f5f5	#f7f7f7	#fafafa	#fcfcfc	#ffffff
#eeeeee	#f0f0f0	#f2f2f2	#f5f5f5	#f7f7f7	#fafafa	#fcfcfc	#ffffff

Kombination von gray238 und #ffffff
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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				#ffffff ist nicht als Schriftfarbe auf Hintergrund gray238 geeignet. Die Unterschiede in der Helligkeit und Farbe sind unzureichend. Die Ähnlichkeit von #ffffff und gray238 ergibt sich zu 94.48%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.52%.

Hintergrundfarbe gray238				Schriftfarbwert #ffffff
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#eeeeee	#eeeeee	#eeeeee	#eeeeee	#ffffff	#ffffff	#ffffff	#ffffff
#f0f0f0	#f0f0f0	#cccccc	#cccccc	#ffffff	#ffffff	#dadada	#dadada
#f2f2f2	#f2f2f2	#aaaaaa	#aaaaaa	#ffffff	#ffffff	#b6b6b6	#b6b6b6
#f5f5f5	#f5f5f5	#888888	#888888	#ffffff	#ffffff	#919191	#919191
#f7f7f7	#f7f7f7	#666666	#666666	#ffffff	#ffffff	#6d6d6d	#6d6d6d
#fafafa	#fafafa	#444444	#444444	#ffffff	#ffffff	#484848	#484848
#fcfcfc	#fcfcfc	#222222	#222222	#ffffff	#ffffff	#242424	#242424
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray238 und Farbwert #ffffff

Hintergrund/Text-Kombination bei Befehl a

Einen Verweis erzeugen Sie mit Befehl <a> und kann farblich gestaltet werden.

Bei diesem Beispiel ändern wir die Textfarbe von <a> auf Farbwert #ffffff und die Hintergrundfarbe von <a> auf Farbe gray238. Als Schriftart setzen wir courier new. Die Schriftgröße ändern wir auf 13px.

<style type="text/css"><!--
  a { 
    background-color: gray238; 
    font-family: courier new; 
    color: #fff; 
    font-size: 13px;
  }
//-->
</style>

Weiteres zum Thema a können Sie in Verweise und Protokolle in HTML erfahren. Möglichkeiten vom Tag a sind in der HTML Referenz bei <a> ausführlich gezeigt.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag address

Die Hintergrundfarbe soll sich von Farbe gray238 auf Farbwert #ffffff ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <address> in Farbe gray238 vor.

Wir setzen für dieses Beispiel bei <address> die Hintergrundfarbe auf Farbe gray238. Die Textfarbe behalten wir bei. Die Schriftart setzen wir auf monospace.

<style type="text/css"><!--
  address { 
    background-color:gray238; 
    font-family:monospace;
  }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Hintergrundfarbe zu #ffffff ändert.

<style type="text/css"><!--
  address:hover { 
    background-color:#ffffff;
  }
//-->
</style>

Weiteres zum Thema können Sie in Blockorientierte Elemente in HTML erfahren. Mehr zum hier verwendeten Befehl <address>.