Ressourcen: 137 HTML Farbnamen - Kombination von Farbe darkblue und Farbwert #ff8c00

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 darkblue			Schriftfarbwert #ff8c00
Detail	:	Hintergrund darkblue	Detail	:	Schrift #ff8c00
Farbe	:	darkblue	Farbwert	:	#ff8c00
Farbwert	:	#00008b	Farbe	:	darkorange
HTML	:	darkblue	HTML	:	#ff8c00
HTML (Wert)	:	#00008b	HTML (Wert)	:	#ff8c00
CSS	:	darkblue	CSS	:	#ff8c00
CSS (Wert)	:	#00008b	CSS (Wert)	:	#ff8c00
CSS (kürzest)	:	#00008b	CSS (kürzest)	:	#ff8c00
CSS (RGB)	:	rgb(0,0,139)	CSS (RGB)	:	rgb(255,140,0)
CSS (%RGB)	:	rgb(0%,0%,54%)	CSS (%RGB)	:	rgb(100%,54%,0%)

Verlauf Hintergrundfarbe darkblue nach Schriftfarbwert #ff8c00
#00008b	#241477	#482863	#6d3c4f	#91503b	#b66427	#da7813	#ff8c00
#00008b	#241477	#482863	#6d3c4f	#91503b	#b66427	#da7813	#ff8c00

Kombination von darkblue und #ff8c00
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#ff8c00 eignet sich als Schriftfarbe auf Hintergrund darkblue, weil der Farbenunterschied in Ordnung ist, der Helligkeitsunterschied ebenso. Die Ähnlichkeit der Farben #ff8c00 und darkblue beträgt 68.77%. Die Lesbarkeit dieser Farbkombination liegt damit bei 31.23%.

Hintergrundfarbe darkblue				Schriftfarbwert #ff8c00
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#00008b	#00008b	#00008b	#00008b	#ff8c00	#ff8c00	#ff8c00	#ff8c00
#24249b	#24249b	#000077	#000077	#ff9c24	#ff9c24	#da7800	#da7800
#4848ac	#4848ac	#000063	#000063	#ffac48	#ffac48	#b66400	#b66400
#6d6dbc	#6d6dbc	#00004f	#00004f	#ffbd6d	#ffbd6d	#915000	#915000
#9191cd	#9191cd	#00003b	#00003b	#ffcd91	#ffcd91	#6d3c00	#6d3c00
#b6b6dd	#b6b6dd	#000027	#000027	#ffdeb6	#ffdeb6	#482800	#482800
#dadaee	#dadaee	#000013	#000013	#ffeeda	#ffeeda	#241400	#241400
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe darkblue und Farbwert #ff8c00

Wechsel der Hintergrundfarbe bei Hover bei Tag abbr

Die Hintergrundfarbe soll sich von Farbe darkblue auf Farbwert #ff8c00 ändern, wenn man mit der Maus auf <abbr> zeigt. Wir bereiten zunächst die Darstellung von <abbr> in Farbe darkblue vor.

Wir legen in diesem Beispiel Farbe darkblue als Hintergrundfarbe von <abbr> fest. Die Textfarbe behalten wir bei. Die Schriftart setzen wir auf monospace und verkleinern die Größe der Schrift auf 89%.

<style type="text/css"><!--
  abbr { 
    font-family:monospace; 
    background-color:darkblue; 
    font-size:89%;
  }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Hintergrundfarbe zu #ff8c00 ändert.

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

Einzelheiten vom hier genutzten Befehl <abbr>.

Wechsel der Umrandung bei Hover von Tag pre

Die Rahmenfarbe soll sich von Farbe darkblue auf Farbwert #ff8c00 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <pre> in Farbe darkblue vor.

In diesem Beispiel umranden wir <pre> mit einem 1 Pixel dicken, gestrichelten Rahmen in Farbe darkblue.

<style type="text/css"><!--
  pre { border:1px dashed darkblue; }
//-->
</style>

Jetzt stellen wir ein, dass bei Berührung mit der Maus die Rahmenfarbe auf #ff8c00 geändert wird.

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

Weiteres zum Thema können Sie in Blockorientierte Elemente in HTML nachsehen. Mehr zum hier verwendeten Tag pre ist in der HTML Referenz bei <pre> ausführlich beschrieben.