Ressourcen: 120 HTML Farbnamen - Kombination von Farbe mediumblue und Farbwert #deb887

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen Farbwerten, die einem bestimmten Schema folgen, definierte man noch 120 Werte und ordnete ihnen Namen zu.

Hintergrundfarbe mediumblue			Schriftfarbwert #deb887
Detail	:	Hintergrund mediumblue	Detail	:	Schrift #deb887
Farbe	:	mediumblue	Farbwert	:	#deb887
Farbwert	:	#0000cd	Farbe	:	burlywood
HTML	:	mediumblue	HTML	:	#deb887
HTML (Wert)	:	#0000cd	HTML (Wert)	:	#deb887
CSS	:	mediumblue	CSS	:	#deb887
CSS (Wert)	:	#0000cd	CSS (Wert)	:	#deb887
CSS (kürzest)	:	#0000cd	CSS (kürzest)	:	#deb887
CSS (RGB)	:	rgb(0,0,205)	CSS (RGB)	:	rgb(222,184,135)
CSS (%RGB)	:	rgb(0%,0%,80%)	CSS (%RGB)	:	rgb(87%,72%,52%)

Verlauf Hintergrundfarbe mediumblue nach Schriftfarbwert #deb887
#0000cd	#1f1ac3	#3f34b9	#5f4eaf	#7e69a5	#9e839b	#be9d91	#deb887
#0000cd	#1f1ac3	#3f34b9	#5f4eaf	#7e69a5	#9e839b	#be9d91	#deb887

Kombination von mediumblue und #deb887
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				#deb887 eignet sich nicht als Schriftfarbe auf Hintergrund mediumblue. Zwar ist der Helligkeitsunterschied in Ordnung, doch die Farben selbst sind zu ähnlich. Die Ähnlichkeit der Farben #deb887 und mediumblue ergibt sich zu 71.37%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 28.63%.

Hintergrundfarbe mediumblue				Schriftfarbwert #deb887
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#0000cd	#0000cd	#0000cd	#0000cd	#deb887	#deb887	#deb887	#deb887
#2424d4	#2424d4	#0000af	#0000af	#e2c298	#e2c298	#be9d73	#be9d73
#4848db	#4848db	#000092	#000092	#e7cca9	#e7cca9	#9e8360	#9e8360
#6d6de2	#6d6de2	#000075	#000075	#ecd6ba	#ecd6ba	#7e694d	#7e694d
#9191e9	#9191e9	#000057	#000057	#f0e0cb	#f0e0cb	#5f4e39	#5f4e39
#b6b6f0	#b6b6f0	#00003a	#00003a	#f5eadc	#f5eadc	#3f3426	#3f3426
#dadaf7	#dadaf7	#00001d	#00001d	#faf4ed	#faf4ed	#1f1a13	#1f1a13
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe mediumblue und Farbwert #deb887

Wechsel der Unterstreichung bei Hover mit HTML-Befehl blockquote

Die Farbe der Unterstreichung soll sich von Farbe mediumblue auf Farbwert #deb887 ändern, wenn man mit der Maus auf <blockquote> zeigt. Bereiten wir zunächst eine Darstellung von <blockquote> in Farbe mediumblue vor.

Hier unterstreichen wir <blockquote> mit einem herausstehenden Rahmen mit 4 Pixel Dicke in Farbe mediumblue.

<style type="text/css"><!--
  blockquote { border-bottom:4px outset mediumblue; }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Unterstreichungsfarbe auf #deb887 ändert.

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

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben. Manchmal sehen Sie das bei Links. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Es ist aber keine "wirkliche" Unterstreichung, der Text selbst ist nicht unterstrichen. Die Unterstreichung wird mit einem Rahmen simuliert und dieser ist unabhängig vom Text.

Weiteres zum Thema lesen Sie in Blockorientierte Elemente in HTML. Der hier verwendete HTML-Befehl blockquote ist in der HTML Referenz bei <blockquote> genau gezeigt.

Text- und Unterstreichungsfarben mit Tag strike

Hier ändern wir die Textfarbe von <strike> auf Farbwert #deb887. Die Schriftart ändern wir auf verdana. Die Schriftgröße setzen wir auf 92%. Wir unterstreichen den Inhalt von <strike> mit Hilfe eines einfallenden Rahmens mit 5 Pixel Dicke in Farbe mediumblue. Das ist mit HTML kaum möglich. Wir verwenden deshalb CSS zur Formatierung.

<style type="text/css"><!--
  strike { 
    color:#deb887; 
    border-bottom-color:mediumblue; 
    border-bottom-width:5px; 
    font-size:92%; 
    font-family:verdana; 
    border-bottom-style:inset;
  }
//-->
</style>

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

Mehr zum Thema können Sie in Text in HTML lesen. Einzelheiten vom Befehl strike sind in der HTML Referenz bei <strike> gezeigt.