Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #9acd32 und Farbwert #ffffff

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbwert #9acd32			Schriftfarbwert #ffffff
Detail	:	Hintergrund #9acd32	Detail	:	Schrift #ffffff
Farbwert	:	#9acd32	Farbwert	:	#ffffff
Farbe	:	yellowgreen	Farbe	:	white
HTML	:	#9acd32	HTML	:	#ffffff
HTML (Wert)	:	#9acd32	HTML (Wert)	:	#ffffff
CSS	:	#9acd32	CSS	:	#ffffff
CSS (Wert)	:	#9acd32	CSS (Wert)	:	#ffffff
CSS (kürzest)	:	#9acd32	CSS (kürzest)	:	#fff
CSS (RGB)	:	rgb(154,205,50)	CSS (RGB)	:	rgb(255,255,255)
CSS (%RGB)	:	rgb(60%,80%,19%)	CSS (%RGB)	:	rgb(100%,100%,100%)

Verlauf Hintergrundfarbwert #9acd32 nach Schriftfarbwert #ffffff
#9acd32	#a8d44f	#b6db6c	#c5e289	#d3e9a7	#e2f0c4	#f0f7e1	#ffffff
#9acd32	#a8d44f	#b6db6c	#c5e289	#d3e9a7	#e2f0c4	#f0f7e1	#ffffff

Kombination von #9acd32 und #ffffff
Cras vestibulum tristique erat, ac interdum justo cursus in. 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 id velit ante.				Die Ähnlichkeit der Farben #ffffff und #9acd32 ergibt sich zu 91.03%. Die Lesbarkeit dieser Farbkombination liegt damit bei 8.97%. #ffffff eignet sich nicht als Schriftfarbe auf Hintergrund #9acd32. Weder der Helligkeitsunterschied noch der Farbunterschied sind ausreichend.

Hintergrundfarbwert #9acd32				Schriftfarbwert #ffffff
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#9acd32	#9acd32	#9acd32	#9acd32	#ffffff	#ffffff	#ffffff	#ffffff
#a8d44f	#a8d44f	#84af2a	#84af2a	#ffffff	#ffffff	#dadada	#dadada
#b6db6c	#b6db6c	#6e9223	#6e9223	#ffffff	#ffffff	#b6b6b6	#b6b6b6
#c5e289	#c5e289	#58751c	#58751c	#ffffff	#ffffff	#919191	#919191
#d3e9a7	#d3e9a7	#425715	#425715	#ffffff	#ffffff	#6d6d6d	#6d6d6d
#e2f0c4	#e2f0c4	#2c3a0e	#2c3a0e	#ffffff	#ffffff	#484848	#484848
#f0f7e1	#f0f7e1	#161d07	#161d07	#ffffff	#ffffff	#242424	#242424
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #9acd32 und Farbwert #ffffff

Füllen und Umranden bei Befehl li

Für dieses Beispiel umranden wir <li> mit einem gepunkteten, 1 Pixel dicken Rahmen in Farbwert #ffffff . Den Hintergrund von <li> setzen wir entsprechend auf Farbwert #9acd32. Das geht in HTML nicht. Wir verwenden deshalb CSS zur Formatierung.

<style type="text/css"><!--
  li { border:1px dotted #fff; background-color:#9acd32; }
//-->
</style>

Weiteres zum Thema li lesen Sie in Listen und Glossare in HTML. Möglichkeiten vom hier gezeigten Tag li sind in der HTML Referenz bei <li> ausführlich beschrieben.

Wechsel der Umrandung bei Hover mit HTML-Tag h5

Mit HTML-Tag <h5> erzeugen Sie eine Überschrift. Diese kann hervorgehoben und farblich gestaltet werden.

Die Rahmenfarbe soll sich von Farbwert #9acd32 auf Farbwert #ffffff ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <h5> in Farbwert #9acd32 vor.

In diesem Beispiel umranden wir <h5> mit einem 1 Pixel dicken, doppelten Rahmen in Farbwert #9acd32.

<style type="text/css"><!--
  h5 { border:1px double #9acd32; }
//-->
</style>

Nun stellen wir ein, dass sich bei Berührung mit der Maus die Rahmenfarbe auf #ffffff ändert.

<style type="text/css"><!--
  h5: hover { 
    border-color: #ffffff;
  }
//-->
</style>

Weiteres zum Thema können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Beschreibung vom hier verwendeten HTML-Befehl <h5>.