Ressourcen: 120 HTML Farbnamen - Kombination von Farbe greenyellow und Farbe deeppink

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 greenyellow			Schriftfarbe deeppink
Detail	:	Hintergrund greenyellow	Detail	:	Schrift deeppink
Farbe	:	greenyellow	Farbe	:	deeppink
Farbwert	:	#adff2f	Farbwert	:	#ff1493
HTML	:	greenyellow	HTML	:	deeppink
HTML (Wert)	:	#adff2f	HTML (Wert)	:	#ff1493
CSS	:	greenyellow	CSS	:	deeppink
CSS (Wert)	:	#adff2f	CSS (Wert)	:	#ff1493
CSS (kürzest)	:	#adff2f	CSS (kürzest)	:	#ff1493
CSS (RGB)	:	rgb(173,255,47)	CSS (RGB)	:	rgb(255,20,147)
CSS (%RGB)	:	rgb(67%,100%,18%)	CSS (%RGB)	:	rgb(100%,7%,57%)

Verlauf Hintergrundfarbe greenyellow nach Schriftfarbe deeppink
#adff2f	#b8dd3d	#c4bb4b	#d09a59	#db7868	#e75776	#f33584	#ff1493
#adff2f	#b8dd3d	#c4bb4b	#d09a59	#db7868	#e75776	#f33584	#ff1493

Kombination von greenyellow und deeppink
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				deeppink ist nicht als Schriftfarbe auf Hintergrund greenyellow geeignet, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind. Die Ähnlichkeit von deeppink und greenyellow ergibt sich zu 85.88%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 14.12%.

Hintergrundfarbe greenyellow				Schriftfarbe deeppink
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#adff2f	#adff2f	#adff2f	#adff2f	#ff1493	#ff1493	#ff1493	#ff1493
#b8ff4c	#b8ff4c	#94da28	#94da28	#ff35a2	#ff35a2	#da117e	#da117e
#c4ff6a	#c4ff6a	#7bb621	#7bb621	#ff57b1	#ff57b1	#b60e69	#b60e69
#d0ff88	#d0ff88	#62911a	#62911a	#ff78c1	#ff78c1	#910b54	#910b54
#dbffa5	#dbffa5	#4a6d14	#4a6d14	#ff9ad0	#ff9ad0	#6d083f	#6d083f
#e7ffc3	#e7ffc3	#31480d	#31480d	#ffbbe0	#ffbbe0	#48052a	#48052a
#f3ffe1	#f3ffe1	#182406	#182406	#ffddef	#ffddef	#240215	#240215
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe greenyellow und Farbe deeppink

Text- und Unterstreichungsfarben von Tag caption

Für dieses Beispiel ändern wir die Textfarbe von <caption> auf Farbe deeppink und lassen die Hintergrundfarbe unverändert. Die Schriftart ändern wir auf courier new. Die Schriftgröße verringern wir auf 82%. Wir unterstreichen den Inhalt von <caption> mit Hilfe eines gestrichelten Rahmens mit 5 Punkte Dicke in Farbe greenyellow. In HTML geht das nicht. Deshalb nutzen wir dafür CSS.

<style type="text/css"><!--
  caption { 
    color:deeppink; 
    border-bottom-style:dashed; 
    border-bottom-color:greenyellow; 
    font-family:courier new; 
    font-size:82%; 
    border-bottom-width:5pt;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Weiteres zum Thema caption finden Sie in Tabellen in HTML. Möglichkeiten des hier verwendeten HTML-Befehl <caption>.

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag blockquote

Die Hintergrundfarbe soll sich von Farbe greenyellow auf Farbe deeppink ändern, wenn man mit der Maus auf <blockquote> zeigt. Bereiten wir zunächst die Formatierung von <blockquote> in Farbe greenyellow vor.

In diesem Beispiel legen wir Farbe greenyellow als Hintergrundfarbe von <blockquote> fest. Die Textfarbe verändern wir nicht, setzen jedoch die Schriftart auf monospace. Die Schriftgröße setzen wir auf 9px:

<style type="text/css"><!--
  blockquote { 
    background-color:greenyellow; 
    font-size:9px; 
    font-family:monospace;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Hover die Hintergrundfarbe auf deeppink ändert.

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

Mehr zum Thema blockquote lesen Sie in Blockorientierte Elemente in HTML. Einzelheiten vom Befehl blockquote sind in der HTML Referenz unter <blockquote> zusammengestellt.