Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #a0522d und Farbwert #2e8b57

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 #a0522d			Schriftfarbwert #2e8b57
Detail	:	Hintergrund #a0522d	Detail	:	Schrift #2e8b57
Farbwert	:	#a0522d	Farbwert	:	#2e8b57
Farbe	:	sienna	Farbe	:	seagreen
HTML	:	#a0522d	HTML	:	#2e8b57
HTML (Wert)	:	#a0522d	HTML (Wert)	:	#2e8b57
CSS	:	#a0522d	CSS	:	#2e8b57
CSS (Wert)	:	#a0522d	CSS (Wert)	:	#2e8b57
CSS (kürzest)	:	#a0522d	CSS (kürzest)	:	#2e8b57
CSS (RGB)	:	rgb(160,82,45)	CSS (RGB)	:	rgb(46,139,87)
CSS (%RGB)	:	rgb(62%,32%,17%)	CSS (%RGB)	:	rgb(18%,54%,34%)

Verlauf Hintergrundfarbwert #a0522d nach Schriftfarbwert #2e8b57
#a0522d	#8f5a33	#7f6239	#6f6a3f	#5e7245	#4e7a4b	#3e8251	#2e8b57
#a0522d	#8f5a33	#7f6239	#6f6a3f	#5e7245	#4e7a4b	#3e8251	#2e8b57

Kombination von #a0522d und #2e8b57
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.				#2e8b57 ist nicht als Schriftfarbe auf Hintergrund #a0522d geeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied gross genug sind. Die Ähnlichkeit der Farben #2e8b57 und #a0522d beträgt 93.70%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 6.30%.

Hintergrundfarbwert #a0522d				Schriftfarbwert #2e8b57
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#a0522d	#a0522d	#a0522d	#a0522d	#2e8b57	#2e8b57	#2e8b57	#2e8b57
#ad6a4b	#ad6a4b	#894626	#894626	#4b9b6f	#4b9b6f	#27774a	#27774a
#bb8369	#bb8369	#723a20	#723a20	#69ac87	#69ac87	#20633e	#20633e
#c89c87	#c89c87	#5b2e19	#5b2e19	#87bc9f	#87bc9f	#1a4f31	#1a4f31
#d6b4a5	#d6b4a5	#442313	#442313	#a5cdb7	#a5cdb7	#133b25	#133b25
#e3cdc3	#e3cdc3	#2d170c	#2d170c	#c3ddcf	#c3ddcf	#0d2718	#0d2718
#f1e6e1	#f1e6e1	#160b06	#160b06	#e1eee7	#e1eee7	#06130c	#06130c
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #a0522d und Farbwert #2e8b57

Wechsel der Textfarbe bei Hover bei Tag p

Die Textfarbe soll sich von Farbwert #a0522d auf Farbwert #2e8b57 ändern, wenn man mit der Maus auf <p> zeigt. Wir bereiten zunächst eine Darstellung von <p> in Farbwert #a0522d vor.

Wir legen für dieses Beispiel Farbwert #a0522d als Textfarbe von <p> fest:

<style type="text/css"><!--
  p { 
    color:#a0522d;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Mausberührung die Textfarbe zu #2e8b57 ändert.

<style type="text/css"><!--
  p:hover { 
    color:#2e8b57;
  }
//-->
</style>

Mehr zu p können Sie in Grundlegende Gestaltungselemente in HTML finden. Weiteres zum hier verwendeten Befehl <p>.

Text- und Unterstreichungsfarben bei Tag caption

Wir ändern in diesem Beispiel die Textfarbe von <caption> auf Farbwert #2e8b57. Die Schriftart setzen wir auf arial und setzen die Schriftgröße auf 12pt. Wir unterstreichen den Inhalt von <caption> mit Hilfe eines gestrichelten Rahmens mit 2 Punkte Dicke in Farbwert #a0522d. Das geht mit HTML nicht. Wir nutzen daher CSS zur Formatierung.

<style type="text/css"><!--
  caption { 
    border-bottom-style: dashed; 
    border-bottom-color: #a0522d; 
    border-bottom-width: 2pt; 
    color: #2e8b57; 
    font-family: arial; 
    font-size: 12pt;
  }
//-->
</style>

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

Weiteres zum Thema caption finden Sie in Tabellen in HTML. Einzelheiten vom hier verwendeten HTML-Tag caption lesen Sie in der HTML Referenz unter <caption>.