Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #87ceeb und Farbe darkorange

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 #87ceeb			Schriftfarbe darkorange
Detail	:	Hintergrund #87ceeb	Detail	:	Schrift darkorange
Farbwert	:	#87ceeb	Farbe	:	darkorange
Farbe	:	skyblue	Farbwert	:	#ff8c00
HTML	:	#87ceeb	HTML	:	darkorange
HTML (Wert)	:	#87ceeb	HTML (Wert)	:	#ff8c00
CSS	:	#87ceeb	CSS	:	darkorange
CSS (Wert)	:	#87ceeb	CSS (Wert)	:	#ff8c00
CSS (kürzest)	:	#87ceeb	CSS (kürzest)	:	#ff8c00
CSS (RGB)	:	rgb(135,206,235)	CSS (RGB)	:	rgb(255,140,0)
CSS (%RGB)	:	rgb(52%,80%,92%)	CSS (%RGB)	:	rgb(100%,54%,0%)

Verlauf Hintergrundfarbwert #87ceeb nach Schriftfarbe darkorange
#87ceeb	#98c4c9	#a9bba7	#bab186	#cba864	#dc9e43	#ed9521	#ff8c00
#87ceeb	#98c4c9	#a9bba7	#bab186	#cba864	#dc9e43	#ed9521	#ff8c00

Kombination von #87ceeb und darkorange
Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. 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.				darkorange ist nicht als Schriftfarbe auf Hintergrund #87ceeb geeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend. Die Ähnlichkeit von darkorange und #87ceeb beträgt 93.62%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 6.38%.

Hintergrundfarbwert #87ceeb				Schriftfarbe darkorange
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#87ceeb	#87ceeb	#87ceeb	#87ceeb	#ff8c00	#ff8c00	#ff8c00	#ff8c00
#98d5ed	#98d5ed	#73b0c9	#73b0c9	#ff9c24	#ff9c24	#da7800	#da7800
#a9dcf0	#a9dcf0	#6093a7	#6093a7	#ffac48	#ffac48	#b66400	#b66400
#bae3f3	#bae3f3	#4d7586	#4d7586	#ffbd6d	#ffbd6d	#915000	#915000
#cbeaf6	#cbeaf6	#395864	#395864	#ffcd91	#ffcd91	#6d3c00	#6d3c00
#dcf1f9	#dcf1f9	#263a43	#263a43	#ffdeb6	#ffdeb6	#482800	#482800
#edf8fc	#edf8fc	#131d21	#131d21	#ffeeda	#ffeeda	#241400	#241400
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #87ceeb und Farbe darkorange

Wechsel der Hintergrundfarbe bei Hover mit HTML-Befehl col

Die Hintergrundfarbe soll sich von Farbwert #87ceeb auf Farbe darkorange ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <col> in Farbwert #87ceeb vor.

In diesem Beispiel setzen wir die Hintergrundfarbe von <col> auf Farbwert #87ceeb. Die Textfarbe ändern wir nicht. Die Schriftart setzen wir auf arial. Die Schriftgröße setzen wir auf 81%:

<style type="text/css"><!--
  col { 
    font-size: 81%; 
    background-color: #87ceeb; 
    font-family: arial;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Hover die Hintergrundfarbe auf darkorange gesetzt wird.

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

Mehr zum Thema col können Sie in Tabellen in HTML nachlesen. Beschreibung des Tag <col>.

Wechsel der Unterstreichung bei Hover bei HTML-Befehl blockquote

Die Farbe der Unterstreichung soll sich von Farbwert #87ceeb auf Farbe darkorange ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <blockquote> in Farbwert #87ceeb vor.

Hier unterstreichen wir <blockquote> mit einem gefurchten Rahmen mit 2 Pixel Dicke in Farbwert #87ceeb.

<style type="text/css"><!--
  blockquote { border-bottom:2px groove #87ceeb; }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Unterstreichungsfarbe auf darkorange geändert wird.

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

Die Idee ist, unabhängige Formatierungen für Inhalt und Unterstreichung zu nutzen. Manchmal sehen Sie diesen Effekt bei Verweisen. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Das ist jedoch keine "normale" Unterstreichung, der Text hat keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Mehr zum Thema können Sie in Blockorientierte Elemente in HTML finden. Weiteres zum hier genutzten HTML-Befehl blockquote erfahren Sie in der HTML Referenz unter <blockquote>.