Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #7cfc00 und Farbwert #d3d3d3

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 #7cfc00			Schriftfarbwert #d3d3d3
Detail	:	Hintergrund #7cfc00	Detail	:	Schrift #d3d3d3
Farbwert	:	#7cfc00	Farbwert	:	#d3d3d3
Farbe	:	lawngreen	Farbe	:	lightgrey
HTML	:	#7cfc00	HTML	:	#d3d3d3
HTML (Wert)	:	#7cfc00	HTML (Wert)	:	#d3d3d3
CSS	:	#7cfc00	CSS	:	#d3d3d3
CSS (Wert)	:	#7cfc00	CSS (Wert)	:	#d3d3d3
CSS (kürzest)	:	#7cfc00	CSS (kürzest)	:	#d3d3d3
CSS (RGB)	:	rgb(124,252,0)	CSS (RGB)	:	rgb(211,211,211)
CSS (%RGB)	:	rgb(48%,98%,0%)	CSS (%RGB)	:	rgb(82%,82%,82%)

Verlauf Hintergrundfarbwert #7cfc00 nach Schriftfarbwert #d3d3d3
#7cfc00	#88f61e	#94f03c	#a1ea5a	#ade478	#bade96	#c6d8b4	#d3d3d3
#7cfc00	#88f61e	#94f03c	#a1ea5a	#ade478	#bade96	#c6d8b4	#d3d3d3

Kombination von #7cfc00 und #d3d3d3
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.				#d3d3d3 ist nicht als Schriftfarbe auf Hintergrund #7cfc00 geeignet, weil sich die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit von #d3d3d3 und #7cfc00 ergibt sich zu 94.64%. Die Lesbarkeit dieser Kombination liegt damit bei 5.36%.

Hintergrundfarbwert #7cfc00				Schriftfarbwert #d3d3d3
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#7cfc00	#7cfc00	#7cfc00	#7cfc00	#d3d3d3	#d3d3d3	#d3d3d3	#d3d3d3
#8efc24	#8efc24	#6ad800	#6ad800	#d9d9d9	#d9d9d9	#b4b4b4	#b4b4b4
#a1fc48	#a1fc48	#58b400	#58b400	#dfdfdf	#dfdfdf	#969696	#969696
#b4fd6d	#b4fd6d	#469000	#469000	#e5e5e5	#e5e5e5	#787878	#787878
#c6fd91	#c6fd91	#356c00	#356c00	#ececec	#ececec	#5a5a5a	#5a5a5a
#d9feb6	#d9feb6	#234800	#234800	#f2f2f2	#f2f2f2	#3c3c3c	#3c3c3c
#ecfeda	#ecfeda	#112400	#112400	#f8f8f8	#f8f8f8	#1e1e1e	#1e1e1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #7cfc00 und Farbwert #d3d3d3

Wechsel der Umrandung bei Hover von HTML-Tag li

Die Rahmenfarbe soll sich von Farbwert #7cfc00 auf Farbwert #d3d3d3 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <li> in Farbwert #7cfc00 vor.

In diesem Beispiel umranden wir <li> mit einem 4 Pixel dicken, gefurchten Rahmen in Farbwert #7cfc00.

<style type="text/css"><!--
  li { 
    border-color: #7cfc00; 
    border-width: 4px; 
    border-style: groove;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Mausberührung die Rahmenfarbe auf #d3d3d3 ändert.

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

Mehr zum Thema können Sie in Listen und Glossare in HTML nachlesen. Möglichkeiten des hier gezeigten HTML-Tag li finden Sie in der HTML Referenz unter <li>.

Wechsel der Hintergrundfarbe bei Hover bei HTML-Befehl h4

Mit HTML-Befehl <h4> wird eine Überschrift erzeugt. Diese können Sie hervorheben und farblich gestalten.

Die Hintergrundfarbe soll sich von Farbwert #7cfc00 auf Farbwert #d3d3d3 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <h4> in Farbwert #7cfc00 vor.

Wir legen z.B. Farbwert #7cfc00 als Hintergrundfarbe von <h4> fest. Die Textfarbe verändern wir nicht, setzen jedoch die Schriftart auf arial. Die Größe der Schrift setzen wir auf 9pt:

<style type="text/css"><!--
  h4 { 
    background-color:#7cfc00; 
    font-size:9pt; 
    font-family:arial;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Hintergrundfarbe auf #d3d3d3 gesetzt wird.

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

Mehr zu h4 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Weiteres zum HTML-Befehl h4 finden Sie in der HTML Referenz unter <h4>.