Ressourcen: 120 HTML Farbnamen - Kombination von Farbe mintcream und Farbe gold

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 mintcream			Schriftfarbe gold
Detail	:	Hintergrund mintcream	Detail	:	Schrift gold
Farbe	:	mintcream	Farbe	:	gold
Farbwert	:	#f5fffa	Farbwert	:	#ffd700
HTML	:	mintcream	HTML	:	gold
HTML (Wert)	:	#f5fffa	HTML (Wert)	:	#ffd700
CSS	:	mintcream	CSS	:	gold
CSS (Wert)	:	#f5fffa	CSS (Wert)	:	#ffd700
CSS (kürzest)	:	#f5fffa	CSS (kürzest)	:	#ffd700
CSS (RGB)	:	rgb(245,255,250)	CSS (RGB)	:	rgb(255,215,0)
CSS (%RGB)	:	rgb(96%,100%,98%)	CSS (%RGB)	:	rgb(100%,84%,0%)

Verlauf Hintergrundfarbe mintcream nach Schriftfarbe gold
#f5fffa	#f6f9d6	#f7f3b2	#f9ed8e	#fae86b	#fce247	#fddc23	#ffd700
#f5fffa	#f6f9d6	#f7f3b2	#f9ed8e	#fae86b	#fce247	#fddc23	#ffd700

Kombination von mintcream und gold
Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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.				Auf Hintergrund mintcream ist gold ungeeignet. Die Helligkeit und Farben sind sich zu ähnlich. Die Ähnlichkeit von gold und mintcream ergibt sich zu 93.46%. Die Lesbarkeit dieser Kombination bewerte ich mit 6.54%.

Hintergrundfarbe mintcream				Schriftfarbe gold
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f5fffa	#f5fffa	#f5fffa	#f5fffa	#ffd700	#ffd700	#ffd700	#ffd700
#f6fffa	#f6fffa	#d2dad6	#d2dad6	#ffdc24	#ffdc24	#dab800	#dab800
#f7fffb	#f7fffb	#afb6b2	#afb6b2	#ffe248	#ffe248	#b69900	#b69900
#f9fffc	#f9fffc	#8c918e	#8c918e	#ffe86d	#ffe86d	#917a00	#917a00
#fafffc	#fafffc	#696d6b	#696d6b	#ffed91	#ffed91	#6d5c00	#6d5c00
#fcfffd	#fcfffd	#464847	#464847	#fff3b6	#fff3b6	#483d00	#483d00
#fdfffe	#fdfffe	#232423	#232423	#fff9da	#fff9da	#241e00	#241e00
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe mintcream und Farbe gold

Zebra-Effekt bei Befehl td

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man vom so genannten Zebra-Effekt. Der Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <td> mit den Hintergrundfarben Farbe mintcream und Farbe gold.

<style type="text/css"><!--
  td.ung { 
    background-color: mintcream;
  }
  td.ger { 
    background-color:gold;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd angewendet.

<table>
<tr><td class="ung">A1.1</td><td class="ger">A2.1</td><td class="ung">A3.1</td></tr>
<tr><td class="ung">A1.2</td><td class="ger">A2.2</td><td class="ung">A3.2</td></tr>
<tr><td class="ung">A1.3</td><td class="ger">A2.3</td><td class="ung">A3.3</td></tr>
</table>

Mehr zum Thema td können Sie in Tabellen in HTML lesen. Weiteres zum hier verwendeten HTML-Tag <td>.

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag div

Mit HTML-Befehl <div> wird ein Kontainer gesetzt. Er kann farblich gestaltet werden.

Die Hintergrundfarbe soll sich von Farbe mintcream auf Farbe gold ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <div> in Farbe mintcream vor.

Wir legen in diesem Beispiel bei <div> die Hintergrundfarbe auf Farbe mintcream fest und setzen die Größe der Schrift auf 13px:

<style type="text/css"><!--
  div { 
    font-size: 13px; 
    background-color: mintcream;
  }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Hintergrundfarbe auf gold ändert.

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

Mehr zum hier gezeigten Tag <div>.