Ressourcen: 256 Graustufen in HTML - Kombination von Farbe gray237 und Farbwert #bebebe

Graustufen enthalten natürlich alle 16 Graustufen und insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 256 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 255 (d.h. hexadezimal 00 bis ff).

Hintergrundfarbe gray237			Schriftfarbwert #bebebe
Detail	:	Hintergrund gray237	Detail	:	Schrift #bebebe
Farbe	:	gray237	Farbwert	:	#bebebe
Farbwert	:	#ededed	Farbe	:	gray190
HTML	:	gray237	HTML	:	#bebebe
HTML (Wert)	:	#ededed	HTML (Wert)	:	#bebebe
CSS	:	gray237	CSS	:	#bebebe
CSS (Wert)	:	#ededed	CSS (Wert)	:	#bebebe
CSS (kürzest)	:	#ededed	CSS (kürzest)	:	#bebebe
CSS (RGB)	:	rgb(237,237,237)	CSS (RGB)	:	rgb(190,190,190)
CSS (%RGB)	:	rgb(92%,92%,92%)	CSS (%RGB)	:	rgb(74%,74%,74%)

Verlauf Hintergrundfarbe gray237 nach Schriftfarbwert #bebebe
#ededed	#e6e6e6	#dfdfdf	#d8d8d8	#d2d2d2	#cbcbcb	#c4c4c4	#bebebe
#ededed	#e6e6e6	#dfdfdf	#d8d8d8	#d2d2d2	#cbcbcb	#c4c4c4	#bebebe

Kombination von gray237 und #bebebe
Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit von #bebebe und gray237 beträgt 92.44%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 7.56%. Auf Hintergrund gray237 ist #bebebe ungeeignet. Die Helligkeit und Farben sind zu ähnlich.

Hintergrundfarbe gray237				Schriftfarbwert #bebebe
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ededed	#ededed	#ededed	#ededed	#bebebe	#bebebe	#bebebe	#bebebe
#efefef	#efefef	#cbcbcb	#cbcbcb	#c7c7c7	#c7c7c7	#a2a2a2	#a2a2a2
#f2f2f2	#f2f2f2	#a9a9a9	#a9a9a9	#d0d0d0	#d0d0d0	#878787	#878787
#f4f4f4	#f4f4f4	#878787	#878787	#d9d9d9	#d9d9d9	#6c6c6c	#6c6c6c
#f7f7f7	#f7f7f7	#656565	#656565	#e3e3e3	#e3e3e3	#515151	#515151
#f9f9f9	#f9f9f9	#434343	#434343	#ececec	#ececec	#363636	#363636
#fcfcfc	#fcfcfc	#212121	#212121	#f5f5f5	#f5f5f5	#1b1b1b	#1b1b1b
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray237 und Farbwert #bebebe

Wechsel der Hintergrundfarbe bei Hover mit HTML-Befehl h2

Mit Befehl <h2> wird eine Überschrift gesetzt. Diese kann man hervorheben und farblich gestalten.

Die Hintergrundfarbe soll sich von Farbe gray237 auf Farbwert #bebebe ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <h2> in Farbe gray237 vor.

Für dieses Beispiel legen wir bei <h2> die Hintergrundfarbe auf Farbe gray237 fest. Die Textfarbe verändern wir nicht. Die Schriftart ändern wir auf arial. Die Größe der Schrift verkleinern wir auf 96%:

<style type="text/css"><!--
  h2 { 
    background-color:gray237; 
    font-size:96%; 
    font-family:arial;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Hintergrundfarbe zu #bebebe ändert.

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

Weiteres zum Thema h2 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Der hier verwendete Befehl h2 ist in der HTML Referenz bei <h2> gezeigt.

Text- und Unterstreichungsfarben bei HTML-Tag address

Wir ändern für dieses Beispiel die Textfarbe von <address> auf Farbwert #bebebe. Die Schriftart setzen wir auf arial und ändern die Schriftgröße auf 11px. Wir unterstreichen den Inhalt von <address> mit Hilfe eines gefurchten Rahmens mit 2 Punkte Dicke in Farbe gray237. Dies geht in HTML kaum. Deshalb verwenden wir CSS.

<style type="text/css"><!--
  address { 
    border-bottom-style:groove; 
    border-bottom-color:gray237; 
    color:#bebebe; 
    font-size:11px; 
    font-family:arial; 
    border-bottom-width:2pt;
  }
//-->
</style>

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

Mehr zu address können Sie in Blockorientierte Elemente in HTML erfahren. Weiteres zum Befehl address erfahren Sie in der HTML Referenz unter <address>.