Ressourcen: 120 HTML Farbnamen - Kombination von Farbe sandybrown und Farbwert #f8f8ff

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 sandybrown			Schriftfarbwert #f8f8ff
Detail	:	Hintergrund sandybrown	Detail	:	Schrift #f8f8ff
Farbe	:	sandybrown	Farbwert	:	#f8f8ff
Farbwert	:	#f4a460	Farbe	:	ghostwhite
HTML	:	sandybrown	HTML	:	#f8f8ff
HTML (Wert)	:	#f4a460	HTML (Wert)	:	#f8f8ff
CSS	:	sandybrown	CSS	:	#f8f8ff
CSS (Wert)	:	#f4a460	CSS (Wert)	:	#f8f8ff
CSS (kürzest)	:	#f4a460	CSS (kürzest)	:	#f8f8ff
CSS (RGB)	:	rgb(244,164,96)	CSS (RGB)	:	rgb(248,248,255)
CSS (%RGB)	:	rgb(95%,64%,37%)	CSS (%RGB)	:	rgb(97%,97%,100%)

Verlauf Hintergrundfarbe sandybrown nach Schriftfarbwert #f8f8ff
#f4a460	#f4b076	#f5bc8d	#f5c8a4	#f6d4ba	#f6e0d1	#f7ece8	#f8f8ff
#f4a460	#f4b076	#f5bc8d	#f5c8a4	#f6d4ba	#f6e0d1	#f7ece8	#f8f8ff

Kombination von sandybrown und #f8f8ff
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras vestibulum tristique erat, ac interdum justo cursus in.				#f8f8ff ist nicht als Schriftfarbe auf Hintergrund sandybrown geeignet, da weder der Helligkeitsunterschied noch der Farbunterschied ausreichend sind. Die Ähnlichkeit der Farben #f8f8ff und sandybrown ergibt sich zu 90.84%. Die Lesbarkeit dieser Kombination ergibt sich zu 9.16%.

Hintergrundfarbe sandybrown				Schriftfarbwert #f8f8ff
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f4a460	#f4a460	#f4a460	#f4a460	#f8f8ff	#f8f8ff	#f8f8ff	#f8f8ff
#f5b176	#f5b176	#d18c52	#d18c52	#f9f9ff	#f9f9ff	#d4d4da	#d4d4da
#f7be8d	#f7be8d	#ae7544	#ae7544	#fafaff	#fafaff	#b1b1b6	#b1b1b6
#f8cba4	#f8cba4	#8b5d36	#8b5d36	#fbfbff	#fbfbff	#8d8d91	#8d8d91
#fad8ba	#fad8ba	#684629	#684629	#fcfcff	#fcfcff	#6a6a6d	#6a6a6d
#fbe5d1	#fbe5d1	#452e1b	#452e1b	#fdfdff	#fdfdff	#464648	#464648
#fdf2e8	#fdf2e8	#22170d	#22170d	#fefeff	#fefeff	#232324	#232324
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe sandybrown und Farbwert #f8f8ff

Wechsel der Textfarbe bei Hover bei HTML-Tag h1

Eine Überschrift der 1. Stufe wird mit Befehl <h1> gesetzt. Diese können Sie hervorheben und farblich gestalten.

Die Textfarbe soll sich von Farbe sandybrown auf Farbwert #f8f8ff ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <h1> in Farbe sandybrown vor.

Wir legen für dieses Beispiel Farbe sandybrown als Textfarbe von <h1> fest. Zwar lassen wir die Hintergrundfarbe unverändert, ändern jedoch die Schriftart auf sans-serif und verkleinern die Schriftgröße auf 86%:

<style type="text/css"><!--
  h1 { 
    font-family:sans-serif; 
    color:sandybrown; 
    font-size:86%;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Textfarbe auf #f8f8ff gesetzt wird.

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

Weiteres zum Thema h1 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Möglichkeiten des hier genutzten Tag h1 sind in der HTML Referenz bei <h1> ausführlich beschrieben.

Zebra-Effekt mit Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man von einem Zebra-Effekt. Der Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <tr> mit unterschiedlichen Hintergrundfarben Farbe sandybrown und Farbwert #f8f8ff.

<style type="text/css"><!--
  tr.ung { 
    background-color:sandybrown;
  }
  tr.ger { 
    background-color: #f8f8ff;
  }
//-->
</style>

Diese Klassen werden abwechselnd genutzt.

<table>
<tr class="ung"><td>BA,A</td><td>BB,A</td><td>BC,A</td></tr>
<tr class="ger"><td>BA,B</td><td>BB,B</td><td>BC,B</td></tr>
<tr class="ung"><td>BA,C</td><td>BB,C</td><td>BC,C</td></tr>
</table>

Mehr zum Thema finden Sie in Tabellen in HTML. Möglichkeiten vom HTML-Tag <tr>.