Ressourcen: 137 HTML Farbnamen - Kombination von Farbe fuchsia und Farbwert #ffefd5

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.

Hintergrundfarbe fuchsia			Schriftfarbwert #ffefd5
Detail	:	Hintergrund fuchsia	Detail	:	Schrift #ffefd5
Farbe	:	fuchsia	Farbwert	:	#ffefd5
Farbwert	:	#ff00ff	Farbe	:	papayawhip
HTML	:	fuchsia	HTML	:	#ffefd5
HTML (Wert)	:	#ff00ff	HTML (Wert)	:	#ffefd5
CSS	:	fuchsia	CSS	:	#ffefd5
CSS (Wert)	:	#ff00ff	CSS (Wert)	:	#ffefd5
CSS (kürzest)	:	#f0f	CSS (kürzest)	:	#ffefd5
CSS (RGB)	:	rgb(255,0,255)	CSS (RGB)	:	rgb(255,239,213)
CSS (%RGB)	:	rgb(100%,0%,100%)	CSS (%RGB)	:	rgb(100%,93%,83%)

Verlauf Hintergrundfarbe fuchsia nach Schriftfarbwert #ffefd5
#ff00ff	#ff22f9	#ff44f3	#ff66ed	#ff88e7	#ffaae1	#ffccdb	#ffefd5
#ff00ff	#ff22f9	#ff44f3	#ff66ed	#ff88e7	#ffaae1	#ffccdb	#ffefd5

Kombination von fuchsia und #ffefd5
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras id velit ante.				Die Ähnlichkeit von #ffefd5 und fuchsia beträgt 86.80%. Die Lesbarkeit dieser Kombination ergibt sich zu 13.20%. #ffefd5 eignet sich nicht als Schriftfarbe auf Hintergrund fuchsia, da die Farben zu ähnlich sind.

Hintergrundfarbe fuchsia				Schriftfarbwert #ffefd5
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff00ff	#ff00ff	#ff00ff	#ff00ff	#ffefd5	#ffefd5	#ffefd5	#ffefd5
#ff24ff	#ff24ff	#da00da	#da00da	#fff1db	#fff1db	#daccb6	#daccb6
#ff48ff	#ff48ff	#b600b6	#b600b6	#fff3e1	#fff3e1	#b6aa98	#b6aa98
#ff6dff	#ff6dff	#910091	#910091	#fff5e7	#fff5e7	#918879	#918879
#ff91ff	#ff91ff	#6d006d	#6d006d	#fff8ed	#fff8ed	#6d665b	#6d665b
#ffb6ff	#ffb6ff	#480048	#480048	#fffaf3	#fffaf3	#48443c	#48443c
#ffdaff	#ffdaff	#240024	#240024	#fffcf9	#fffcf9	#24221e	#24221e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe fuchsia und Farbwert #ffefd5

Wechsel der Unterstreichung bei Hover mit HTML-Befehl kbd

Die Farbe der Unterstreichung soll sich von Farbe fuchsia auf Farbwert #ffefd5 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <kbd> in Farbe fuchsia vor.

Hier unterstreichen wir <kbd> mit einem gefurchten Rahmen mit 5 Pixel Dicke in Farbe fuchsia.

<style type="text/css"><!--
  kbd { border-bottom:5px groove fuchsia; }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Unterstreichungsfarbe auf #ffefd5 gesetzt wird.

<style type="text/css"><!--
  kbd: hover { 
    border-bottom-color: #ffefd5;
  }
//-->
</style>

Die Idee ist hierbei, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu nutzen. Öfter sehen Sie das bei Hyperlinks. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Es ist jedoch keine wirkliche Unterstreichung, der Text selbst hat überhaupt keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Mehr zum Thema finden Sie in Text in HTML. Die Beschreibung vom HTML-Tag kbd lesen Sie in der HTML Referenz unter <kbd>.

Wechsel der Hintergrundfarbe bei Hover bei Befehl pre

Die Hintergrundfarbe soll sich von Farbe fuchsia auf Farbwert #ffefd5 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Formatierung von <pre> in Farbe fuchsia vor.

Für dieses Beispiel legen wir die Hintergrundfarbe von <pre> auf Farbe fuchsia fest. Die Textfarbe behalten wir bei, setzen jedoch die Schriftart auf verdana.

<style type="text/css"><!--
  pre { 
    background-color: fuchsia; 
    font-family: verdana;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Hover die Hintergrundfarbe auf #ffefd5 ändert.

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

Weiteres zum Thema pre können Sie in Blockorientierte Elemente in HTML nachlesen. Weiteres zum hier gezeigten Befehl <pre>.