Ressourcen: 120 HTML Farbnamen - Kombination von Farbe skyblue und Farbwert #3cb371

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 skyblue			Schriftfarbwert #3cb371
Detail	:	Hintergrund skyblue	Detail	:	Schrift #3cb371
Farbe	:	skyblue	Farbwert	:	#3cb371
Farbwert	:	#87ceeb	Farbe	:	mediumseagreen
HTML	:	skyblue	HTML	:	#3cb371
HTML (Wert)	:	#87ceeb	HTML (Wert)	:	#3cb371
CSS	:	skyblue	CSS	:	#3cb371
CSS (Wert)	:	#87ceeb	CSS (Wert)	:	#3cb371
CSS (kürzest)	:	#87ceeb	CSS (kürzest)	:	#3cb371
CSS (RGB)	:	rgb(135,206,235)	CSS (RGB)	:	rgb(60,179,113)
CSS (%RGB)	:	rgb(52%,80%,92%)	CSS (%RGB)	:	rgb(23%,70%,44%)

Verlauf Hintergrundfarbe skyblue nach Schriftfarbwert #3cb371
#87ceeb	#7ccad9	#71c6c8	#66c2b6	#5cbea5	#51ba93	#46b682	#3cb371
#87ceeb	#7ccad9	#71c6c8	#66c2b6	#5cbea5	#51ba93	#46b682	#3cb371

Kombination von skyblue und #3cb371
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Die Ähnlichkeit der Farben #3cb371 und skyblue beträgt 92.71%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 7.29%. #3cb371 ist nicht als Schriftfarbe auf Hintergrund skyblue geeignet. Sowohl Helligkeit als auch die Farben sind zu ähnlich.

Hintergrundfarbe skyblue				Schriftfarbwert #3cb371
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#87ceeb	#87ceeb	#87ceeb	#87ceeb	#3cb371	#3cb371	#3cb371	#3cb371
#98d5ed	#98d5ed	#73b0c9	#73b0c9	#57bd85	#57bd85	#339960	#339960
#a9dcf0	#a9dcf0	#6093a7	#6093a7	#73c899	#73c899	#2a7f50	#2a7f50
#bae3f3	#bae3f3	#4d7586	#4d7586	#8fd3ad	#8fd3ad	#226640	#226640
#cbeaf6	#cbeaf6	#395864	#395864	#abdec2	#abdec2	#194c30	#194c30
#dcf1f9	#dcf1f9	#263a43	#263a43	#c7e9d6	#c7e9d6	#113320	#113320
#edf8fc	#edf8fc	#131d21	#131d21	#e3f4ea	#e3f4ea	#081910	#081910
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe skyblue und Farbwert #3cb371

Wechsel der Hintergrundfarbe bei Hover mit Befehl dt

Die Hintergrundfarbe soll sich von Farbe skyblue auf Farbwert #3cb371 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <dt> in Farbe skyblue vor.

Hier ändern wir die Hintergrundfarbe von <dt> auf Farbe skyblue. Die Textfarbe verändern wir nicht. Die Schriftart setzen wir auf verdana:

<style type="text/css"><!--
  dt { 
    font-family:verdana; 
    background-color:skyblue;
  }
//-->
</style>

Nun fordern wir, dass sich bei Berührung mit der Maus die Hintergrundfarbe auf #3cb371 ändert.

<style type="text/css"><!--
  dt:hover { 
    background-color:#3cb371;
  }
//-->
</style>

Mehr zum Thema lesen Sie in Listen und Glossare in HTML. Einzelheiten des HTML-Befehl dt lesen Sie in der HTML Referenz unter <dt>.

Wechsel der Unterstreichung bei Hover mit HTML-Tag h2

Eine Überschrift wird mit HTML-Tag <h2> erzeugt. Sie kann hervorgehoben und farblich gestaltet werden.

Die Unterstreichungsfarbe soll sich von Farbe skyblue auf Farbwert #3cb371 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <h2> in Farbe skyblue vor.

In diesem Beispiel unterstreichen wir <h2> mit einem gefurchten Rahmen mit 3 Pixel Dicke in Farbe skyblue.

<style type="text/css"><!--
  h2 { 
    border-bottom-style:groove; 
    border-bottom-color:skyblue; 
    border-bottom-width:3px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Farbe der Unterstreichung auf #3cb371 geändert wird.

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

Die Idee ist dabei, voneinander unabhängige Formatierungen für Inhalt und Unterstreichung zu nutzen. Öfter sehen Sie diesen Effekt bei Links. Der Text wird in einer Farbe dargestellt. Die Unterstreichung in einer anderen. Hierbei handelt es sich jedoch nicht um eine "wirkliche" Unterstreichung, der Text hat gar keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und dieser ist unabhängig vom Text.

Weiteres zum Thema h2 erfahren Sie in Grundlegende Gestaltungselemente in HTML. Einzelheiten des hier genutzten Befehl h2 erfahren Sie in der HTML Referenz unter <h2>.