Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #696969 und Farbwert #006400

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.

Hintergrundfarbwert #696969			Schriftfarbwert #006400
Detail	:	Hintergrund #696969	Detail	:	Schrift #006400
Farbwert	:	#696969	Farbwert	:	#006400
Farbe	:	dimgray	Farbe	:	darkgreen
HTML	:	#696969	HTML	:	#006400
HTML (Wert)	:	#696969	HTML (Wert)	:	#006400
CSS	:	#696969	CSS	:	#006400
CSS (Wert)	:	#696969	CSS (Wert)	:	#006400
CSS (kürzest)	:	#696969	CSS (kürzest)	:	#006400
CSS (RGB)	:	rgb(105,105,105)	CSS (RGB)	:	rgb(0,100,0)
CSS (%RGB)	:	rgb(41%,41%,41%)	CSS (%RGB)	:	rgb(0%,39%,0%)

Verlauf Hintergrundfarbwert #696969 nach Schriftfarbwert #006400
#696969	#5a685a	#4b674b	#3c663c	#2d662d	#1e651e	#0f640f	#006400
#696969	#5a685a	#4b674b	#3c663c	#2d662d	#1e651e	#0f640f	#006400

Kombination von #696969 und #006400
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.				#006400 ist nicht als Schriftfarbe auf Hintergrund #696969 geeignet, da sich die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit von #006400 und #696969 ergibt sich zu 93.55%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 6.45%.

Hintergrundfarbwert #696969				Schriftfarbwert #006400
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#696969	#696969	#696969	#696969	#006400	#006400	#006400	#006400
#7e7e7e	#7e7e7e	#5a5a5a	#5a5a5a	#247a24	#247a24	#005500	#005500
#939393	#939393	#4b4b4b	#4b4b4b	#489048	#489048	#004700	#004700
#a9a9a9	#a9a9a9	#3c3c3c	#3c3c3c	#6da66d	#6da66d	#003900	#003900
#bebebe	#bebebe	#2d2d2d	#2d2d2d	#91bc91	#91bc91	#002a00	#002a00
#d4d4d4	#d4d4d4	#1e1e1e	#1e1e1e	#b6d2b6	#b6d2b6	#001c00	#001c00
#e9e9e9	#e9e9e9	#0f0f0f	#0f0f0f	#dae8da	#dae8da	#000e00	#000e00
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #696969 und Farbwert #006400

Text- und Unterstreichungsfarben mit Tag caption

Wir ändern für dieses Beispiel die Textfarbe von <caption> auf Farbwert #006400. Die Schriftart setzen wir auf courier new und ändern die Schriftgröße auf 13px. Wir unterstreichen den Inhalt von <caption> mit Hilfe eines doppelten Rahmens mit 1 Pixel Dicke in Farbwert #696969. Mit HTML ist dies kaum machbar. Wir verwenden daher CSS zur Formatierung.

<style type="text/css"><!--
  caption { 
    font-family:courier new; 
    border-bottom-color:#696969; 
    border-bottom-style:double; 
    font-size:13px; 
    border-bottom-width:1px; 
    color:#006400;
  }
//-->
</style>

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

Weiteres zum Thema caption können Sie in Tabellen in HTML finden. Mehr zum hier gezeigten Tag <caption>.

Wechsel der Textfarbe bei Hover von HTML-Tag pre

Die Textfarbe soll sich von Farbwert #696969 auf Farbwert #006400 ändern, wenn man mit der Maus auf <pre> zeigt. Wir bereiten zunächst die Formatierung von <pre> in Farbwert #696969 vor.

Hier legen wir Farbwert #696969 als Textfarbe von <pre> fest. Die Hintergrundfarbe lassen wir unverändert. Die Schriftart ändern wir auf sans-serif. Die Größe der Schrift setzen wir auf 11px.

<style type="text/css"><!--
  pre { 
    color: #696969; 
    font-family: sans-serif; 
    font-size: 11px;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Textfarbe auf #006400 gesetzt wird.

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

Weiteres zum Thema lesen Sie in Blockorientierte Elemente in HTML. Einzelheiten vom HTML-Befehl <pre>.