Ressourcen: 137 HTML Farbnamen - Kombination von Farbe oldlace und Farbwert #4682b4

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.

Hintergrundfarbe oldlace			Schriftfarbwert #4682b4
Detail	:	Hintergrund oldlace	Detail	:	Schrift #4682b4
Farbe	:	oldlace	Farbwert	:	#4682b4
Farbwert	:	#fdf5e6	Farbe	:	steelblue
HTML	:	oldlace	HTML	:	#4682b4
HTML (Wert)	:	#fdf5e6	HTML (Wert)	:	#4682b4
CSS	:	oldlace	CSS	:	#4682b4
CSS (Wert)	:	#fdf5e6	CSS (Wert)	:	#4682b4
CSS (kürzest)	:	#fdf5e6	CSS (kürzest)	:	#4682b4
CSS (RGB)	:	rgb(253,245,230)	CSS (RGB)	:	rgb(70,130,180)
CSS (%RGB)	:	rgb(99%,96%,90%)	CSS (%RGB)	:	rgb(27%,50%,70%)

Verlauf Hintergrundfarbe oldlace nach Schriftfarbwert #4682b4
#fdf5e6	#e2e4de	#c8d4d7	#aec3d0	#94b3c9	#7aa2c2	#6092bb	#4682b4
#fdf5e6	#e2e4de	#c8d4d7	#aec3d0	#94b3c9	#7aa2c2	#6092bb	#4682b4

Kombination von oldlace und #4682b4
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.				Auf Hintergrund oldlace ist #4682b4 ungeeignet. Zwar ist der Helligkeitsunterschied gross genug, doch die Farben selbst sind zu ähnlich. Die Ähnlichkeit von #4682b4 und oldlace ergibt sich zu 81.95%. Die Lesbarkeit dieser Kombination bewerte ich mit 18.05%.

Hintergrundfarbe oldlace				Schriftfarbwert #4682b4
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fdf5e6	#fdf5e6	#fdf5e6	#fdf5e6	#4682b4	#4682b4	#4682b4	#4682b4
#fdf6e9	#fdf6e9	#d8d2c5	#d8d2c5	#6093be	#6093be	#3c6f9a	#3c6f9a
#fdf7ed	#fdf7ed	#b4afa4	#b4afa4	#7aa5c9	#7aa5c9	#325c80	#325c80
#fdf9f0	#fdf9f0	#908c83	#908c83	#95b7d4	#95b7d4	#284a66	#284a66
#fefaf4	#fefaf4	#6c6962	#6c6962	#afc9de	#afc9de	#1e374d	#1e374d
#fefcf7	#fefcf7	#484641	#484641	#cadbe9	#cadbe9	#142533	#142533
#fefdfb	#fefdfb	#242320	#242320	#e4edf4	#e4edf4	#0a1219	#0a1219
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe oldlace und Farbwert #4682b4

Text- und Unterstreichungsfarben von Tag acronym

Für dieses Beispiel ändern wir die Textfarbe von <acronym> auf Farbwert #4682b4 und lassen die Hintergrundfarbe unverändert. Die Schriftart setzen wir auf sans-serif und setzen die Schriftgröße auf 114%. Wir unterstreichen den Inhalt von <acronym> mit Hilfe eines gestrichelten Rahmens mit 5 Pixel Dicke in Farbe oldlace. Mit HTML ist das kaum möglich. Wir nutzen deshalb CSS.

<style type="text/css"><!--
  acronym { 
    color: #4682b4; 
    border-bottom: 5px dashed oldlace; 
    font-family: sans-serif; 
    font-size: 114%;
  }
//-->
</style>

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

Weiteres zum Befehl acronym ist in der HTML Referenz unter <acronym> genau gezeigt.

Wechsel der Textfarbe bei Hover mit Tag em

Die Textfarbe soll sich von Farbe oldlace auf Farbwert #4682b4 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Formatierung von <em> in Farbe oldlace vor.

Wir ändern in diesem Beispiel die Textfarbe von <em> auf Farbe oldlace. Die Schriftgröße setzen wir auf 13px:

<style type="text/css"><!--
  em { 
    font-size: 13px; 
    color: oldlace;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe auf #4682b4 ändert.

<style type="text/css"><!--
  em: hover { 
    color: #4682b4;
  }
//-->
</style>

Mehr zum Thema erfahren Sie in Text in HTML. Weiteres zum HTML-Tag em erfahren Sie in der HTML Referenz unter <em>.