Ressourcen: 120 HTML Farbnamen - Kombination von Farbe mediumseagreen und Farbwert #ffffe0

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 mediumseagreen			Schriftfarbwert #ffffe0
Detail	:	Hintergrund mediumseagreen	Detail	:	Schrift #ffffe0
Farbe	:	mediumseagreen	Farbwert	:	#ffffe0
Farbwert	:	#3cb371	Farbe	:	lightyellow
HTML	:	mediumseagreen	HTML	:	#ffffe0
HTML (Wert)	:	#3cb371	HTML (Wert)	:	#ffffe0
CSS	:	mediumseagreen	CSS	:	#ffffe0
CSS (Wert)	:	#3cb371	CSS (Wert)	:	#ffffe0
CSS (kürzest)	:	#3cb371	CSS (kürzest)	:	#ffffe0
CSS (RGB)	:	rgb(60,179,113)	CSS (RGB)	:	rgb(255,255,224)
CSS (%RGB)	:	rgb(23%,70%,44%)	CSS (%RGB)	:	rgb(100%,100%,87%)

Verlauf Hintergrundfarbe mediumseagreen nach Schriftfarbwert #ffffe0
#3cb371	#57bd80	#73c890	#8fd3a0	#abdeb0	#c7e9c0	#e3f4d0	#ffffe0
#3cb371	#57bd80	#73c890	#8fd3a0	#abdeb0	#c7e9c0	#e3f4d0	#ffffe0

Kombination von mediumseagreen und #ffffe0
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit der Farben #ffffe0 und mediumseagreen ergibt sich zu 87.53%. Die Lesbarkeit dieser Kombination ergibt sich zu 12.47%. #ffffe0 ist nicht als Schriftfarbe auf Hintergrund mediumseagreen geeignet, weil sich die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbe mediumseagreen				Schriftfarbwert #ffffe0
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#3cb371	#3cb371	#3cb371	#3cb371	#ffffe0	#ffffe0	#ffffe0	#ffffe0
#57bd85	#57bd85	#339960	#339960	#ffffe4	#ffffe4	#dadac0	#dadac0
#73c899	#73c899	#2a7f50	#2a7f50	#ffffe8	#ffffe8	#b6b6a0	#b6b6a0
#8fd3ad	#8fd3ad	#226640	#226640	#ffffed	#ffffed	#919180	#919180
#abdec2	#abdec2	#194c30	#194c30	#fffff1	#fffff1	#6d6d60	#6d6d60
#c7e9d6	#c7e9d6	#113320	#113320	#fffff6	#fffff6	#484840	#484840
#e3f4ea	#e3f4ea	#081910	#081910	#fffffa	#fffffa	#242420	#242420
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe mediumseagreen und Farbwert #ffffe0

Zebra-Effekt von HTML-Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man vom Zebra-Effekt. Er unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .yang und .ying für <tr> mit unterschiedlichen Hintergrundfarben Farbe mediumseagreen und Farbwert #ffffe0.

<style type="text/css"><!--
  tr.yang { 
    background-color: mediumseagreen;
  }
  tr.ying { 
    background-color:#ffffe0;
  }
//-->
</style>

Diese werden abwechselnd genutzt.

<table>
<tr class="yang"><td>La,a</td><td>Lb,a</td><td>Lc,a</td></tr>
<tr class="ying"><td>La,b</td><td>Lb,b</td><td>Lc,b</td></tr>
<tr class="yang"><td>La,c</td><td>Lb,c</td><td>Lc,c</td></tr>
</table>

Mehr zum Thema können Sie in Tabellen in HTML erfahren. Zur Beschreibung des hier genutzten HTML-Befehl <tr>.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag p

Die Hintergrundfarbe soll sich von Farbe mediumseagreen auf Farbwert #ffffe0 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <p> in Farbe mediumseagreen vor.

Wir legen als Beispiel die Hintergrundfarbe von <p> auf Farbe mediumseagreen fest. Zwar behalten wir die Textfarbe bei, setzen jedoch die Schriftart auf courier new:

<style type="text/css"><!--
  p { 
    background-color:mediumseagreen; 
    font-family:courier new;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Hintergrundfarbe auf #ffffe0 gesetzt wird.

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

Mehr zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Die Beschreibung vom hier gezeigten Tag p erfahren Sie in der HTML Referenz unter <p>.