Ressourcen: 120 HTML Farbnamen - Kombination von Farbe oldlace und Farbwert #66cdaa

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 oldlace			Schriftfarbwert #66cdaa
Detail	:	Hintergrund oldlace	Detail	:	Schrift #66cdaa
Farbe	:	oldlace	Farbwert	:	#66cdaa
Farbwert	:	#fdf5e6	Farbe	:	mediumaquamarine
HTML	:	oldlace	HTML	:	#66cdaa
HTML (Wert)	:	#fdf5e6	HTML (Wert)	:	#66cdaa
CSS	:	oldlace	CSS	:	#66cdaa
CSS (Wert)	:	#fdf5e6	CSS (Wert)	:	#66cdaa
CSS (kürzest)	:	#fdf5e6	CSS (kürzest)	:	#66cdaa
CSS (RGB)	:	rgb(253,245,230)	CSS (RGB)	:	rgb(102,205,170)
CSS (%RGB)	:	rgb(99%,96%,90%)	CSS (%RGB)	:	rgb(40%,80%,66%)

Verlauf Hintergrundfarbe oldlace nach Schriftfarbwert #66cdaa
#fdf5e6	#e7efdd	#d1e9d4	#bce3cc	#a6dec3	#91d8bb	#7bd2b2	#66cdaa
#fdf5e6	#e7efdd	#d1e9d4	#bce3cc	#a6dec3	#91d8bb	#7bd2b2	#66cdaa

Kombination von oldlace und #66cdaa
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Die Ähnlichkeit der Farben #66cdaa und oldlace ergibt sich zu 91.52%. Die Lesbarkeit dieser Kombination bewerte ich mit 8.48%. #66cdaa ist nicht als Schriftfarbe auf Hintergrund oldlace geeignet, da die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbe oldlace				Schriftfarbwert #66cdaa
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fdf5e6	#fdf5e6	#fdf5e6	#fdf5e6	#66cdaa	#66cdaa	#66cdaa	#66cdaa
#fdf6e9	#fdf6e9	#d8d2c5	#d8d2c5	#7bd4b6	#7bd4b6	#57af91	#57af91
#fdf7ed	#fdf7ed	#b4afa4	#b4afa4	#91dbc2	#91dbc2	#489279	#489279
#fdf9f0	#fdf9f0	#908c83	#908c83	#a7e2ce	#a7e2ce	#3a7561	#3a7561
#fefaf4	#fefaf4	#6c6962	#6c6962	#bde9da	#bde9da	#2b5748	#2b5748
#fefcf7	#fefcf7	#484641	#484641	#d3f0e6	#d3f0e6	#1d3a30	#1d3a30
#fefdfb	#fefdfb	#242320	#242320	#e9f7f2	#e9f7f2	#0e1d18	#0e1d18
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe oldlace und Farbwert #66cdaa

Zebra-Effekt bei HTML-Tag th

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man von einem so genannten Zebra-Effekt. Der Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <th> mit unterschiedlichen Hintergrundfarben Farbe oldlace und Farbwert #66cdaa.

<style type="text/css"><!--
  th.ung { 
    background-color: oldlace;
  }
  th.ger { 
    background-color: #66cdaa;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd angewendet.

<table>
<tr><td class="ung">EA~A</td><td class="ger">EB~A</td><td class="ung">EC~A</td></tr>
<tr><td class="ung">EA~B</td><td class="ger">EB~B</td><td class="ung">EC~B</td></tr>
<tr><td class="ung">EA~C</td><td class="ger">EB~C</td><td class="ung">EC~C</td></tr>
</table>

Weiteres zum Thema th erfahren Sie in Tabellen in HTML. Möglichkeiten vom HTML-Tag th finden Sie in der HTML Referenz unter <th>.

Wechsel der Textfarbe bei Hover bei Tag li

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

Wir legen in diesem Beispiel Farbe oldlace als Textfarbe von <li> fest. Die Hintergrundfarbe lassen wir unverändert, ändern jedoch die Schriftart auf courier new.

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

Nun fordern wir, dass bei Hover die Textfarbe auf #66cdaa geändert wird.

<style type="text/css"><!--
  li: hover { 
    color: #66cdaa;
  }
//-->
</style>

Mehr zum Thema li lesen Sie in Listen und Glossare in HTML. Mehr zum HTML-Tag li ist in der HTML Referenz bei <li> ausführlich zusammengestellt.