Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #00ff7f 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.

Hintergrundfarbwert #00ff7f			Schriftfarbe slategray
Detail	:	Hintergrund #00ff7f	Detail	:	Schrift slategray
Farbwert	:	#00ff7f	Farbe	:	slategray
Farbe	:	springgreen	Farbwert	:	#708090
HTML	:	#00ff7f	HTML	:	slategray
HTML (Wert)	:	#00ff7f	HTML (Wert)	:	#708090
CSS	:	#00ff7f	CSS	:	slategray
CSS (Wert)	:	#00ff7f	CSS (Wert)	:	#708090
CSS (kürzest)	:	#00ff7f	CSS (kürzest)	:	#708090
CSS (RGB)	:	rgb(0,255,127)	CSS (RGB)	:	rgb(112,128,144)
CSS (%RGB)	:	rgb(0%,100%,49%)	CSS (%RGB)	:	rgb(43%,50%,56%)

Verlauf Hintergrundfarbwert #00ff7f nach Schriftfarbe slategray
#00ff7f	#10ec81	#20da83	#30c886	#40b688	#50a48b	#60928d	#708090
#00ff7f	#10ec81	#20da83	#30c886	#40b688	#50a48b	#60928d	#708090

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

Hintergrundfarbwert #00ff7f				Schriftfarbe slategray
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#00ff7f	#00ff7f	#00ff7f	#00ff7f	#708090	#708090	#708090	#708090
#24ff91	#24ff91	#00da6c	#00da6c	#84929f	#84929f	#606d7b	#606d7b
#48ffa3	#48ffa3	#00b65a	#00b65a	#98a4af	#98a4af	#505b66	#505b66
#6dffb5	#6dffb5	#009148	#009148	#adb6bf	#adb6bf	#404952	#404952
#91ffc8	#91ffc8	#006d36	#006d36	#c1c8cf	#c1c8cf	#30363d	#30363d
#b6ffda	#b6ffda	#004824	#004824	#d6dadf	#d6dadf	#202429	#202429
#daffec	#daffec	#002412	#002412	#eaecef	#eaecef	#101214	#101214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #00ff7f und Farbe slategray

Wechsel der Umrandung bei Hover mit HTML-Tag frameset

Die Rahmenfarbe soll sich von Farbwert #00ff7f auf Farbe slategray ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Formatierung von <frameset> in Farbwert #00ff7f vor.

In diesem Beispiel umranden wir <frameset> mit einem 4 Pixel dicken, gefurchten Rahmen in Farbwert #00ff7f.

<style type="text/css"><!--
  frameset { 
    border-style: groove; 
    border-width: 4px; 
    border-color: #00ff7f;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe zu slategray ändert.

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

Der hier genutzte Befehl frameset ist in der HTML Referenz bei <frameset> genau zusammengestellt.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag blockquote

Die Hintergrundfarbe soll sich von Farbwert #00ff7f auf Farbe slategray ändern, wenn man mit der Maus auf <blockquote> zeigt. Wir bereiten zunächst eine Darstellung von <blockquote> in Farbwert #00ff7f vor.

Für dieses Beispiel legen wir Farbwert #00ff7f als Hintergrundfarbe von <blockquote> fest. Zwar verändern wir die Textfarbe nicht, ändern jedoch die Schriftart auf monospace und setzen die Größe der Schrift auf 98%:

<style type="text/css"><!--
  blockquote { 
    font-size: 98%; 
    font-family: monospace; 
    background-color: #00ff7f;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Mausberührung die Hintergrundfarbe zu slategray ändert.

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

Mehr zum Thema blockquote erfahren Sie in Blockorientierte Elemente in HTML. Einzelheiten vom hier verwendeten Tag blockquote lesen Sie in der HTML Referenz unter <blockquote>.