Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #fff8dc und Farbwert #f08080

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 #fff8dc			Schriftfarbwert #f08080
Detail	:	Hintergrund #fff8dc	Detail	:	Schrift #f08080
Farbwert	:	#fff8dc	Farbwert	:	#f08080
Farbe	:	cornsilk	Farbe	:	lightcoral
HTML	:	#fff8dc	HTML	:	#f08080
HTML (Wert)	:	#fff8dc	HTML (Wert)	:	#f08080
CSS	:	#fff8dc	CSS	:	#f08080
CSS (Wert)	:	#fff8dc	CSS (Wert)	:	#f08080
CSS (kürzest)	:	#fff8dc	CSS (kürzest)	:	#f08080
CSS (RGB)	:	rgb(255,248,220)	CSS (RGB)	:	rgb(240,128,128)
CSS (%RGB)	:	rgb(100%,97%,86%)	CSS (%RGB)	:	rgb(94%,50%,50%)

Verlauf Hintergrundfarbwert #fff8dc nach Schriftfarbwert #f08080
#fff8dc	#fce6ce	#fad5c1	#f8c4b4	#f6b3a7	#f4a29a	#f2918d	#f08080
#fff8dc	#fce6ce	#fad5c1	#f8c4b4	#f6b3a7	#f4a29a	#f2918d	#f08080

Kombination von #fff8dc und #f08080
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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit von #f08080 und #fff8dc beträgt 88.42%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 11.58%. Auf Hintergrund #fff8dc ist #f08080 ungeeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet.

Hintergrundfarbwert #fff8dc				Schriftfarbwert #f08080
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fff8dc	#fff8dc	#fff8dc	#fff8dc	#f08080	#f08080	#f08080	#f08080
#fff9e1	#fff9e1	#dad4bc	#dad4bc	#f29292	#f29292	#cd6d6d	#cd6d6d
#fffae6	#fffae6	#b6b19d	#b6b19d	#f4a4a4	#f4a4a4	#ab5b5b	#ab5b5b
#fffbeb	#fffbeb	#918d7d	#918d7d	#f6b6b6	#f6b6b6	#894949	#894949
#fffcf0	#fffcf0	#6d6a5e	#6d6a5e	#f8c8c8	#f8c8c8	#663636	#663636
#fffdf5	#fffdf5	#48463e	#48463e	#fadada	#fadada	#442424	#442424
#fffefa	#fffefa	#24231f	#24231f	#fcecec	#fcecec	#221212	#221212
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fff8dc und Farbwert #f08080

Wechsel der Unterstreichung bei Hover bei Befehl legend

Die Farbe der Unterstreichung soll sich von Farbwert #fff8dc auf Farbwert #f08080 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <legend> in Farbwert #fff8dc vor.

Hier unterstreichen wir <legend> mit einem herausstehenden Rahmen mit 5 Pixel Dicke in Farbwert #fff8dc.

<style type="text/css"><!--
  legend { border-bottom:5px outset #fff8dc; }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Unterstreichungsfarbe auf #f08080 ändert.

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

Die Idee ist dabei, unabhängige Formatierungen für Inhalt und Unterstreichung zu verwenden. Manchmal sieht man dies bei Links. Der Text ist in einer Farbe. Die Unterstreichung in einer anderen. Es ist jedoch keine "wirkliche" Unterstreichung, der Text ist gar nicht unterstrichen. Sie wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Weiteres zum Thema erfahren Sie in Formulare in HTML. Zur Beschreibung des hier verwendeten HTML-Tag <legend>.

Wechsel der Hintergrundfarbe bei Hover von HTML-Tag h3

Eine Überschrift setzt man mit HTML-Befehl <h3>. Diese können Sie farblich gestalten.

Die Hintergrundfarbe soll sich von Farbwert #fff8dc auf Farbwert #f08080 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <h3> in Farbwert #fff8dc vor.

Wir legen z.B. die Hintergrundfarbe von <h3> auf Farbwert #fff8dc fest:

<style type="text/css"><!--
  h3 { 
    background-color: #fff8dc;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Hintergrundfarbe auf #f08080 geändert wird.

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

Mehr zu h3 können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Weiteres zum hier verwendeten HTML-Befehl <h3>.