Ressourcen: 256 Graustufen in HTML - Kombinationen mit Farbwert #1d1d1d

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).

Hintergrundfarbwert #1d1d1d
Detail	:	Hintergrundfarbwert #1d1d1d	Verlauf nach Weiß		Verlauf nach Schwarz
Farbwert	:	#1d1d1d	#1d1d1d	#1d1d1d	#1d1d1d	#1d1d1d
Farbe	:	gray29	#3d3d3d	#3d3d3d	#181818	#181818
HTML	:	#1d1d1d	#5d5d5d	#5d5d5d	#141414	#141414
CSS	:	#1d1d1d	#7d7d7d	#7d7d7d	#101010	#101010
CSS (Wert)	:	#1d1d1d	#9e9e9e	#9e9e9e	#0c0c0c	#0c0c0c
CSS (kürzest)	:	#1d1d1d	#bebebe	#bebebe	#080808	#080808
CSS (RGB)	:	rgb(29,29,29)	#dedede	#dedede	#040404	#040404
CSS (%RGB)	:	rgb(11%,11%,11%)	#ffffff	#ffffff	#000000	#000000

Beispiele zu Kombinationen mit Farbwert #1d1d1d

Änderung der Unterstreichung bei Hover mit Tag caption

Die Farbe der Unterstreichung soll sich ändern, wenn man mit der Maus darauf zeigt. Für das Beispiel bereiten wir zunächst Formatierungen von <caption> vor.

<style type="text/css"><!--
  caption { 
    border-bottom-color: #3dacd5; 
    border-bottom-style: dotted; 
    border-bottom-width: 1px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Unterstreichungsfarbe auf Farbwert #1d1d1d gesetzt wird.

<style type="text/css"><!--
  caption: hover { 
    border-bottom-color: #1d1d1d;
  }
//-->
</style>

Die Idee ist hierbei, voneinander unabhängige Formatierungen für Inhalt und Unterstreichung zu verwenden. Öfter sehen Sie diesen Effekt bei Links. Der Text wird in einer Farbe dargestellt. Und die Unterstreichung in einer anderen. Es ist aber keine "normale" Unterstreichung, der Text selbst hat gar keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Weiteres zum Thema können Sie in Tabellen in HTML finden. Möglichkeiten vom hier gezeigten HTML-Tag caption erfahren Sie in der HTML Referenz unter <caption>.

Umrandung mit HTML-Befehl hr

In diesem Beispiel umranden wir <hr> mit einem 4 Pixel dicken, herausstehenden Rahmen in Farbwert #1d1d1d. Mit HTML ist das kaum möglich. Wir nutzen deshalb CSS zur Formatierung.

<style type="text/css"><!--
  hr { 
    border-color:#1d1d1d; 
    border-width:4px; 
    border-style:outset;
  }
//-->
</style>

Mehr zu hr finden Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des hier genutzten HTML-Befehl <hr>.