Ressourcen: 120 HTML Farbnamen - Kombination von Farbe lightgreen und Farbe slategray

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 lightgreen			Schriftfarbe slategray
Detail	:	Hintergrund lightgreen	Detail	:	Schrift slategray
Farbe	:	lightgreen	Farbe	:	slategray
Farbwert	:	#90ee90	Farbwert	:	#708090
HTML	:	lightgreen	HTML	:	slategray
HTML (Wert)	:	#90ee90	HTML (Wert)	:	#708090
CSS	:	lightgreen	CSS	:	slategray
CSS (Wert)	:	#90ee90	CSS (Wert)	:	#708090
CSS (kürzest)	:	#90ee90	CSS (kürzest)	:	#708090
CSS (RGB)	:	rgb(144,238,144)	CSS (RGB)	:	rgb(112,128,144)
CSS (%RGB)	:	rgb(56%,93%,56%)	CSS (%RGB)	:	rgb(43%,50%,56%)

Verlauf Hintergrundfarbe lightgreen nach Schriftfarbe slategray
#90ee90	#8bde90	#86ce90	#82be90	#7daf90	#799f90	#748f90	#708090
#90ee90	#8bde90	#86ce90	#82be90	#7daf90	#799f90	#748f90	#708090

Kombination von lightgreen und slategray
Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. 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.				Die Ähnlichkeit von slategray und lightgreen beträgt 86.38%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 13.62%. slategray eignet sich nicht als Schriftfarbe auf Hintergrund lightgreen, da sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe lightgreen				Schriftfarbe slategray
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#90ee90	#90ee90	#90ee90	#90ee90	#708090	#708090	#708090	#708090
#9ff09f	#9ff09f	#7bcc7b	#7bcc7b	#84929f	#84929f	#606d7b	#606d7b
#aff2af	#aff2af	#66aa66	#66aa66	#98a4af	#98a4af	#505b66	#505b66
#bff5bf	#bff5bf	#528852	#528852	#adb6bf	#adb6bf	#404952	#404952
#cff7cf	#cff7cf	#3d663d	#3d663d	#c1c8cf	#c1c8cf	#30363d	#30363d
#dffadf	#dffadf	#294429	#294429	#d6dadf	#d6dadf	#202429	#202429
#effcef	#effcef	#142214	#142214	#eaecef	#eaecef	#101214	#101214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe lightgreen und Farbe slategray

Füllen und Umranden von Tag hr

Hier umranden wir <hr> mit einem gefurchten, 4 Punkte dicken Rahmen in Farbe slategray . Den Hintergrund von <hr> setzen wir auf Farbe lightgreen. Mit HTML ist dies nicht machbar. Wir nutzen daher CSS.

<style type="text/css"><!--
  hr { border:4pt groove slategray; background-color:lightgreen; }
//-->
</style>

Weiteres zum Thema hr können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Zur Beschreibung des Tag <hr>.

Wechsel der Hintergrundfarbe bei Hover von Befehl a

Mit Befehl <a> wird ein Link erzeugt. Dieser kann hervorgehoben und farblich gestaltet werden.

Die Hintergrundfarbe soll sich von Farbe lightgreen auf Farbe slategray ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <a> in Farbe lightgreen vor.

Wir ändern z.B. bei <a> die Hintergrundfarbe auf Farbe lightgreen. Die Textfarbe verändern wir nicht, setzen jedoch die Schriftart auf sans-serif und ändern die Größe der Schrift auf 9pt.

<style type="text/css"><!--
  a { 
    font-size: 9pt; 
    background-color: lightgreen; 
    font-family: sans-serif;
  }
//-->
</style>

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

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

Weiteres zum Thema lesen Sie in Verweise und Protokolle in HTML. Einzelheiten des hier genutzten Befehl a finden Sie in der HTML Referenz unter <a>.