Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #f0f8ff und Farbwert #2f4f4f

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.

Hintergrundfarbwert #f0f8ff			Schriftfarbwert #2f4f4f
Detail	:	Hintergrund #f0f8ff	Detail	:	Schrift #2f4f4f
Farbwert	:	#f0f8ff	Farbwert	:	#2f4f4f
Farbe	:	aliceblue	Farbe	:	darkslategray
HTML	:	#f0f8ff	HTML	:	#2f4f4f
HTML (Wert)	:	#f0f8ff	HTML (Wert)	:	#2f4f4f
CSS	:	#f0f8ff	CSS	:	#2f4f4f
CSS (Wert)	:	#f0f8ff	CSS (Wert)	:	#2f4f4f
CSS (kürzest)	:	#f0f8ff	CSS (kürzest)	:	#2f4f4f
CSS (RGB)	:	rgb(240,248,255)	CSS (RGB)	:	rgb(47,79,79)
CSS (%RGB)	:	rgb(94%,97%,100%)	CSS (%RGB)	:	rgb(18%,30%,30%)

Verlauf Hintergrundfarbwert #f0f8ff nach Schriftfarbwert #2f4f4f
#f0f8ff	#d4dfe5	#b8c7cc	#9dafb3	#81979a	#667f81	#4a6768	#2f4f4f
#f0f8ff	#d4dfe5	#b8c7cc	#9dafb3	#81979a	#667f81	#4a6768	#2f4f4f

Kombination von #f0f8ff und #2f4f4f
Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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.				Die Ähnlichkeit von #2f4f4f und #f0f8ff ergibt sich zu 60.37%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 39.63%. #2f4f4f eignet sich als Schriftfarbe auf Hintergrund #f0f8ff, da der Unterschied in den Farben ok ist, der Helligkeitsunterschied auch.

Hintergrundfarbwert #f0f8ff				Schriftfarbwert #2f4f4f
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f0f8ff	#f0f8ff	#f0f8ff	#f0f8ff	#2f4f4f	#2f4f4f	#2f4f4f	#2f4f4f
#f2f9ff	#f2f9ff	#cdd4da	#cdd4da	#4c6868	#4c6868	#284343	#284343
#f4faff	#f4faff	#abb1b6	#abb1b6	#6a8181	#6a8181	#213838	#213838
#f6fbff	#f6fbff	#898d91	#898d91	#889a9a	#889a9a	#1a2d2d	#1a2d2d
#f8fcff	#f8fcff	#666a6d	#666a6d	#a5b3b3	#a5b3b3	#142121	#142121
#fafdff	#fafdff	#444648	#444648	#c3cccc	#c3cccc	#0d1616	#0d1616
#fcfeff	#fcfeff	#222324	#222324	#e1e5e5	#e1e5e5	#060b0b	#060b0b
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #f0f8ff und Farbwert #2f4f4f

Hintergrund/Text-Kombination von Befehl input

Wir ändern für dieses Beispiel die Textfarbe von <input> auf Farbwert #2f4f4f und die Hintergrundfarbe von <input> auf Farbwert #f0f8ff. Die Schriftart ändern wir auf courier new und als Schriftgröße wählen wir 110%.

<style type="text/css"><!--
  input { 
    font-size: 110%; 
    font-family: courier new; 
    background-color: #f0f8ff; 
    color: #2f4f4f;
  }
//-->
</style>

Mehr zum Thema können Sie in Formulare in HTML nachsehen. Möglichkeiten vom hier genutzten HTML-Tag input erfahren Sie in der HTML Referenz unter <input>.

Wechsel der Textfarbe bei Hover mit Befehl address

Die Textfarbe soll sich von Farbwert #f0f8ff auf Farbwert #2f4f4f ändern, wenn man mit der Maus auf <address> zeigt. Bereiten wir zunächst eine Darstellung von <address> in Farbwert #f0f8ff vor.

Wir legen als Beispiel die Textfarbe von <address> auf Farbwert #f0f8ff fest. Die Hintergrundfarbe verändern wir nicht, setzen jedoch die Schriftart auf verdana. Die Größe der Schrift setzen wir auf 13px:

<style type="text/css"><!--
  address { 
    font-family: verdana; 
    color: #f0f8ff; 
    font-size: 13px;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe zu #2f4f4f ändert.

<style type="text/css"><!--
  address:hover { 
    color:#2f4f4f;
  }
//-->
</style>

Mehr zum Thema können Sie in Blockorientierte Elemente in HTML finden. Beschreibung des hier verwendeten Befehl <address>.