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

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 #c71585			Schriftfarbe mediumseagreen
Detail	:	Hintergrund #c71585	Detail	:	Schrift mediumseagreen
Farbwert	:	#c71585	Farbe	:	mediumseagreen
Farbe	:	mediumvioletred	Farbwert	:	#3cb371
HTML	:	#c71585	HTML	:	mediumseagreen
HTML (Wert)	:	#c71585	HTML (Wert)	:	#3cb371
CSS	:	#c71585	CSS	:	mediumseagreen
CSS (Wert)	:	#c71585	CSS (Wert)	:	#3cb371
CSS (kürzest)	:	#c71585	CSS (kürzest)	:	#3cb371
CSS (RGB)	:	rgb(199,21,133)	CSS (RGB)	:	rgb(60,179,113)
CSS (%RGB)	:	rgb(78%,8%,52%)	CSS (%RGB)	:	rgb(23%,70%,44%)

Verlauf Hintergrundfarbwert #c71585 nach Schriftfarbe mediumseagreen
#c71585	#b32b82	#9f427f	#8b587c	#776f79	#638576	#4f9c73	#3cb371
#c71585	#b32b82	#9f427f	#8b587c	#776f79	#638576	#4f9c73	#3cb371

Kombination von #c71585 und mediumseagreen
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. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit von mediumseagreen und #c71585 ergibt sich zu 90.32%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 9.68%. mediumseagreen eignet sich nicht als Schriftfarbe auf Hintergrund #c71585. Sowohl Helligkeit als auch die Farben sind zu ähnlich.

Hintergrundfarbwert #c71585				Schriftfarbe mediumseagreen
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#c71585	#c71585	#c71585	#c71585	#3cb371	#3cb371	#3cb371	#3cb371
#cf3696	#cf3696	#aa1272	#aa1272	#57bd85	#57bd85	#339960	#339960
#d757a7	#d757a7	#8e0f5f	#8e0f5f	#73c899	#73c899	#2a7f50	#2a7f50
#df79b9	#df79b9	#710c4c	#710c4c	#8fd3ad	#8fd3ad	#226640	#226640
#e79aca	#e79aca	#550939	#550939	#abdec2	#abdec2	#194c30	#194c30
#efbcdc	#efbcdc	#380626	#380626	#c7e9d6	#c7e9d6	#113320	#113320
#f7dded	#f7dded	#1c0313	#1c0313	#e3f4ea	#e3f4ea	#081910	#081910
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #c71585 und Farbe mediumseagreen

Zebra-Effekt bei HTML-Befehl td

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Er unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .even und .odd für <td> mit unterschiedlichen Hintergrundfarben Farbwert #c71585 und Farbe mediumseagreen.

<style type="text/css"><!--
  td.even { 
    background-color: #c71585;
  }
  td.odd { 
    background-color: mediumseagreen;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd verwendet.

<table>
<tr><td class="even">Da-a</td><td class="odd">Db-a</td><td class="even">Dc-a</td></tr>
<tr><td class="even">Da-b</td><td class="odd">Db-b</td><td class="even">Dc-b</td></tr>
<tr><td class="even">Da-c</td><td class="odd">Db-c</td><td class="even">Dc-c</td></tr>
</table>

Mehr zu td können Sie in Tabellen in HTML finden. Der hier genutzte HTML-Befehl td ist in der HTML Referenz bei <td> gezeigt.

Wechsel der Hintergrundfarbe bei Hover bei Tag h4

Mit Tag <h4> erzeugen Sie eine Überschrift. Diese können Sie farblich gestalten.

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

Als Beispiel setzen wir bei <h4> die Hintergrundfarbe auf Farbwert #c71585. Zwar verändern wir die Textfarbe nicht, ändern jedoch die Schriftart auf monospace:

<style type="text/css"><!--
  h4 { 
    font-family: monospace; 
    background-color: #c71585;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Hintergrundfarbe auf mediumseagreen geändert wird.

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

Mehr zu h4 können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Möglichkeiten vom Tag h4 sind in der HTML Referenz unter <h4> genau beschrieben.