Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #8b4513 und Farbe darkslategray

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 #8b4513			Schriftfarbe darkslategray
Detail	:	Hintergrund #8b4513	Detail	:	Schrift darkslategray
Farbwert	:	#8b4513	Farbe	:	darkslategray
Farbe	:	saddlebrown	Farbwert	:	#2f4f4f
HTML	:	#8b4513	HTML	:	darkslategray
HTML (Wert)	:	#8b4513	HTML (Wert)	:	#2f4f4f
CSS	:	#8b4513	CSS	:	darkslategray
CSS (Wert)	:	#8b4513	CSS (Wert)	:	#2f4f4f
CSS (kürzest)	:	#8b4513	CSS (kürzest)	:	#2f4f4f
CSS (RGB)	:	rgb(139,69,19)	CSS (RGB)	:	rgb(47,79,79)
CSS (%RGB)	:	rgb(54%,27%,7%)	CSS (%RGB)	:	rgb(18%,30%,30%)

Verlauf Hintergrundfarbwert #8b4513 nach Schriftfarbe darkslategray
#8b4513	#7d461b	#704724	#63492c	#564a35	#494c3d	#3c4d46	#2f4f4f
#8b4513	#7d461b	#704724	#63492c	#564a35	#494c3d	#3c4d46	#2f4f4f

Kombination von #8b4513 und darkslategray
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				darkslategray eignet sich nicht als Schriftfarbe auf Hintergrund #8b4513, weil die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit der Farben darkslategray und #8b4513 beträgt 94.01%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 5.99%.

Hintergrundfarbwert #8b4513				Schriftfarbe darkslategray
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#8b4513	#8b4513	#8b4513	#8b4513	#2f4f4f	#2f4f4f	#2f4f4f	#2f4f4f
#9b5f34	#9b5f34	#773b10	#773b10	#4c6868	#4c6868	#284343	#284343
#ac7a56	#ac7a56	#63310d	#63310d	#6a8181	#6a8181	#213838	#213838
#bc9478	#bc9478	#4f270a	#4f270a	#889a9a	#889a9a	#1a2d2d	#1a2d2d
#cdaf99	#cdaf99	#3b1d08	#3b1d08	#a5b3b3	#a5b3b3	#142121	#142121
#ddc9bb	#ddc9bb	#271305	#271305	#c3cccc	#c3cccc	#0d1616	#0d1616
#eee4dd	#eee4dd	#130902	#130902	#e1e5e5	#e1e5e5	#060b0b	#060b0b
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #8b4513 und Farbe darkslategray

Wechsel der Textfarbe bei Hover mit Tag a

Mit HTML-Tag <a> setzen Sie einen Hyperlink. Er kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #8b4513 auf Farbe darkslategray ändern, wenn man mit der Maus auf <a> zeigt. Bereiten wir zunächst die Formatierung von <a> in Farbwert #8b4513 vor.

Zum Beispiel ändern wir bei <a> die Textfarbe auf Farbwert #8b4513. Zwar lassen wir die Hintergrundfarbe unverändert, ändern jedoch die Schriftart auf arial:

<style type="text/css"><!--
  a { 
    font-family: arial; 
    color: #8b4513;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Textfarbe auf darkslategray gesetzt wird.

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

Weiteres zu a lesen Sie in Verweise und Protokolle in HTML. Weiteres zum Befehl <a>.

Wechsel der Hintergrundfarbe bei Hover bei Tag abbr

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

Wir legen für dieses Beispiel bei <abbr> die Hintergrundfarbe auf Farbwert #8b4513 fest. Zwar verändern wir die Textfarbe nicht, setzen jedoch die Schriftart auf arial. Die Schriftgröße setzen wir auf 9px:

<style type="text/css"><!--
  abbr { 
    background-color: #8b4513; 
    font-size: 9px; 
    font-family: arial;
  }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Hintergrundfarbe zu darkslategray ändert.

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

Mehr zum HTML-Befehl abbr finden Sie in der HTML Referenz unter <abbr>.