Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #66cdaa und Farbwert #9acd32

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 #66cdaa			Schriftfarbwert #9acd32
Detail	:	Hintergrund #66cdaa	Detail	:	Schrift #9acd32
Farbwert	:	#66cdaa	Farbwert	:	#9acd32
Farbe	:	mediumaquamarine	Farbe	:	yellowgreen
HTML	:	#66cdaa	HTML	:	#9acd32
HTML (Wert)	:	#66cdaa	HTML (Wert)	:	#9acd32
CSS	:	#66cdaa	CSS	:	#9acd32
CSS (Wert)	:	#66cdaa	CSS (Wert)	:	#9acd32
CSS (kürzest)	:	#66cdaa	CSS (kürzest)	:	#9acd32
CSS (RGB)	:	rgb(102,205,170)	CSS (RGB)	:	rgb(154,205,50)
CSS (%RGB)	:	rgb(40%,80%,66%)	CSS (%RGB)	:	rgb(60%,80%,19%)

Verlauf Hintergrundfarbwert #66cdaa nach Schriftfarbwert #9acd32
#66cdaa	#6dcd98	#74cd87	#7ccd76	#83cd65	#8bcd54	#92cd43	#9acd32
#66cdaa	#6dcd98	#74cd87	#7ccd76	#83cd65	#8bcd54	#92cd43	#9acd32

Kombination von #66cdaa und #9acd32
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit von #9acd32 und #66cdaa ergibt sich zu 95.12%. Die Lesbarkeit dieser Kombination ergibt sich zu 4.88%. Auf Hintergrund #66cdaa ist #9acd32 ungeeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied gross genug sind.

Hintergrundfarbwert #66cdaa				Schriftfarbwert #9acd32
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#66cdaa	#66cdaa	#66cdaa	#66cdaa	#9acd32	#9acd32	#9acd32	#9acd32
#7bd4b6	#7bd4b6	#57af91	#57af91	#a8d44f	#a8d44f	#84af2a	#84af2a
#91dbc2	#91dbc2	#489279	#489279	#b6db6c	#b6db6c	#6e9223	#6e9223
#a7e2ce	#a7e2ce	#3a7561	#3a7561	#c5e289	#c5e289	#58751c	#58751c
#bde9da	#bde9da	#2b5748	#2b5748	#d3e9a7	#d3e9a7	#425715	#425715
#d3f0e6	#d3f0e6	#1d3a30	#1d3a30	#e2f0c4	#e2f0c4	#2c3a0e	#2c3a0e
#e9f7f2	#e9f7f2	#0e1d18	#0e1d18	#f0f7e1	#f0f7e1	#161d07	#161d07
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #66cdaa und Farbwert #9acd32

Zebra-Effekt mit Tag th

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Dieser Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <th> mit unterschiedlichen Hintergrundfarben Farbwert #66cdaa und Farbwert #9acd32.

<style type="text/css"><!--
  th.ying { 
    background-color:#66cdaa;
  }
  th.yang { 
    background-color:#9acd32;
  }
//-->
</style>

Diese werden abwechselnd verwendet.

<table>
<tr><td class="ying">Ha-a</td><td class="yang">Hb-a</td><td class="ying">Hc-a</td></tr>
<tr><td class="ying">Ha-b</td><td class="yang">Hb-b</td><td class="ying">Hc-b</td></tr>
<tr><td class="ying">Ha-c</td><td class="yang">Hb-c</td><td class="ying">Hc-c</td></tr>
</table>

Weiteres zum Thema erfahren Sie in Tabellen in HTML. Die Beschreibung vom hier genutzten HTML-Tag th erfahren Sie in der HTML Referenz unter <th>.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag cite

Die Hintergrundfarbe soll sich von Farbwert #66cdaa auf Farbwert #9acd32 ändern, wenn man mit der Maus auf <cite> zeigt. Bereiten wir zunächst die Formatierung von <cite> in Farbwert #66cdaa vor.

Zum Beispiel legen wir Farbwert #66cdaa als Hintergrundfarbe von <cite> fest. Die Textfarbe behalten wir bei, setzen jedoch die Schriftart auf courier new:

<style type="text/css"><!--
  cite { 
    font-family: courier new; 
    background-color: #66cdaa;
  }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Hintergrundfarbe auf #9acd32 ändert.

<style type="text/css"><!--
  cite: hover { 
    background-color: #9acd32;
  }
//-->
</style>

Einzelheiten vom hier verwendeten HTML-Befehl cite sind in der HTML Referenz bei <cite> genau gezeigt.