Ressourcen: 120 HTML Farbnamen - Kombination von Farbe orange und Farbe lightskyblue

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 orange			Schriftfarbe lightskyblue
Detail	:	Hintergrund orange	Detail	:	Schrift lightskyblue
Farbe	:	orange	Farbe	:	lightskyblue
Farbwert	:	#ffa500	Farbwert	:	#87cefa
HTML	:	orange	HTML	:	lightskyblue
HTML (Wert)	:	#ffa500	HTML (Wert)	:	#87cefa
CSS	:	orange	CSS	:	lightskyblue
CSS (Wert)	:	#ffa500	CSS (Wert)	:	#87cefa
CSS (kürzest)	:	#ffa500	CSS (kürzest)	:	#87cefa
CSS (RGB)	:	rgb(255,165,0)	CSS (RGB)	:	rgb(135,206,250)
CSS (%RGB)	:	rgb(100%,64%,0%)	CSS (%RGB)	:	rgb(52%,80%,98%)

Verlauf Hintergrundfarbe orange nach Schriftfarbe lightskyblue
#ffa500	#edaa23	#dcb047	#cbb66b	#babc8e	#a9c2b2	#98c8d6	#87cefa
#ffa500	#edaa23	#dcb047	#cbb66b	#babc8e	#a9c2b2	#98c8d6	#87cefa

Kombination von orange und lightskyblue
Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				lightskyblue eignet sich nicht als Schriftfarbe auf Hintergrund orange, weil sich sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit von lightskyblue und orange ergibt sich zu 94.52%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 5.48%.

Hintergrundfarbe orange				Schriftfarbe lightskyblue
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffa500	#ffa500	#ffa500	#ffa500	#87cefa	#87cefa	#87cefa	#87cefa
#ffb124	#ffb124	#da8d00	#da8d00	#98d5fa	#98d5fa	#73b0d6	#73b0d6
#ffbe48	#ffbe48	#b67500	#b67500	#a9dcfb	#a9dcfb	#6093b2	#6093b2
#ffcb6d	#ffcb6d	#915e00	#915e00	#bae3fc	#bae3fc	#4d758e	#4d758e
#ffd891	#ffd891	#6d4600	#6d4600	#cbeafc	#cbeafc	#39586b	#39586b
#ffe5b6	#ffe5b6	#482f00	#482f00	#dcf1fd	#dcf1fd	#263a47	#263a47
#fff2da	#fff2da	#241700	#241700	#edf8fe	#edf8fe	#131d23	#131d23
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe orange und Farbe lightskyblue

Wechsel der Hintergrundfarbe bei Hover von HTML-Befehl h1

Mit Tag <h1> erzeugen Sie eine Überschrift und kann farblich gestaltet werden.

Die Hintergrundfarbe soll sich von Farbe orange auf Farbe lightskyblue ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <h1> in Farbe orange vor.

Wir legen hier Farbe orange als Hintergrundfarbe von <h1> fest. Zwar behalten wir die Textfarbe bei, setzen jedoch die Schriftart auf courier new:

<style type="text/css"><!--
  h1 { 
    background-color:orange; 
    font-family:courier new;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Hintergrundfarbe auf lightskyblue geändert wird.

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

Weiteres zum Thema finden Sie in Grundlegende Gestaltungselemente in HTML. Mehr zum hier gezeigten HTML-Befehl h1 ist in der HTML Referenz bei <h1> genau gezeigt.

Wechsel der Unterstreichung bei Hover bei HTML-Tag cite

Die Unterstreichungsfarbe soll sich von Farbe orange auf Farbe lightskyblue ändern, wenn man mit der Maus auf <cite> zeigt. Wir bereiten zunächst die Darstellung von <cite> in Farbe orange vor.

Beispielsweise unterstreichen wir <cite> mit Hilfe eines doppelten Rahmens mit 4 Pixel Dicke in Farbe orange.

<style type="text/css"><!--
  cite { 
    border-bottom-color:orange; 
    border-bottom-style:double; 
    border-bottom-width:4px;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Unterstreichungsfarbe auf lightskyblue geändert wird.

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

Die Idee ist dabei, verschiedene Formatierungen für Inhalt und Unterstreichung zu verwenden. Öfter sieht man diesen Effekt bei Verweisen. Der Text wird in einer Farbe dargestellt. Die Unterstreichung in einer anderen. Es ist jedoch keine normale Unterstreichung, der Text selbst ist gar nicht unterstrichen. Die Unterstreichung wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Möglichkeiten vom Befehl cite erfahren Sie in der HTML Referenz unter <cite>.