Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #c71585 und Farbe mediumorchid

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 #c71585			Schriftfarbe mediumorchid
Detail	:	Hintergrund #c71585	Detail	:	Schrift mediumorchid
Farbwert	:	#c71585	Farbe	:	mediumorchid
Farbe	:	mediumvioletred	Farbwert	:	#ba55d3
HTML	:	#c71585	HTML	:	mediumorchid
HTML (Wert)	:	#c71585	HTML (Wert)	:	#ba55d3
CSS	:	#c71585	CSS	:	mediumorchid
CSS (Wert)	:	#c71585	CSS (Wert)	:	#ba55d3
CSS (kürzest)	:	#c71585	CSS (kürzest)	:	#ba55d3
CSS (RGB)	:	rgb(199,21,133)	CSS (RGB)	:	rgb(186,85,211)
CSS (%RGB)	:	rgb(78%,8%,52%)	CSS (%RGB)	:	rgb(72%,33%,82%)

Verlauf Hintergrundfarbwert #c71585 nach Schriftfarbe mediumorchid
#c71585	#c51e90	#c3279b	#c130a6	#bf39b1	#bd42bc	#bb4bc7	#ba55d3
#c71585	#c51e90	#c3279b	#c130a6	#bf39b1	#bd42bc	#bb4bc7	#ba55d3

Kombination von #c71585 und mediumorchid
Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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.				Die Ähnlichkeit von mediumorchid und #c71585 beträgt 93.45%. Die Lesbarkeit dieser Kombination ergibt sich zu 6.55%. mediumorchid eignet sich nicht als Schriftfarbe auf Hintergrund #c71585, da sich die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbwert #c71585				Schriftfarbe mediumorchid
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#c71585	#c71585	#c71585	#c71585	#ba55d3	#ba55d3	#ba55d3	#ba55d3
#cf3696	#cf3696	#aa1272	#aa1272	#c36dd9	#c36dd9	#9f48b4	#9f48b4
#d757a7	#d757a7	#8e0f5f	#8e0f5f	#cd85df	#cd85df	#843c96	#843c96
#df79b9	#df79b9	#710c4c	#710c4c	#d79de5	#d79de5	#6a3078	#6a3078
#e79aca	#e79aca	#550939	#550939	#e1b6ec	#e1b6ec	#4f245a	#4f245a
#efbcdc	#efbcdc	#380626	#380626	#ebcef2	#ebcef2	#35183c	#35183c
#f7dded	#f7dded	#1c0313	#1c0313	#f5e6f8	#f5e6f8	#1a0c1e	#1a0c1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #c71585 und Farbe mediumorchid

Wechsel der Unterstreichung bei Hover mit Befehl blockquote

Die Unterstreichungsfarbe soll sich von Farbwert #c71585 auf Farbe mediumorchid ändern, wenn man mit der Maus auf <blockquote> zeigt. Wir bereiten zunächst die Darstellung von <blockquote> in Farbwert #c71585 vor.

In diesem Beispiel unterstreichen wir <blockquote> mit einem gefurchten Rahmen mit 2 Pixel Dicke in Farbwert #c71585.

<style type="text/css"><!--
  blockquote { border-bottom:2px groove #c71585; }
//-->
</style>

Nun fordern wir, dass bei Hover die Unterstreichungsfarbe auf mediumorchid gesetzt wird.

<style type="text/css"><!--
  blockquote:hover { 
    border-bottom-color:mediumorchid;
  }
//-->
</style>

Die Idee ist hierbei, voneinander unabhängige Formatierungen für Inhalt und Unterstreichung zu verwenden. Öfter sehen Sie das bei Hyperlinks. Der Text ist in einer Farbe. Die Unterstreichung in einer anderen. Es ist aber keine normale Unterstreichung, der Text hat überhaupt keine Unterstreichung. Sie wird mit einem Rahmen simuliert und dieser ist unabhängig vom Text.

Weiteres zu blockquote erfahren Sie in Blockorientierte Elemente in HTML. Weiteres zum Befehl blockquote ist in der HTML Referenz unter <blockquote> zusammengestellt.

Wechsel der Textfarbe bei Hover bei HTML-Tag label

Die Textfarbe soll sich von Farbwert #c71585 auf Farbe mediumorchid ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <label> in Farbwert #c71585 vor.

Wir legen als Beispiel Farbwert #c71585 als Textfarbe von <label> fest. Die Hintergrundfarbe verändern wir nicht. Die Schriftart ändern wir auf monospace und erhöhen die Schriftgröße auf 118%.

<style type="text/css"><!--
  label { 
    font-family:monospace; 
    color:#c71585; 
    font-size:118%;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Textfarbe zu mediumorchid ändert.

<style type="text/css"><!--
  label: hover { 
    color: mediumorchid;
  }
//-->
</style>

Weiteres zu label erfahren Sie in Formulare in HTML. Die Beschreibung vom hier verwendeten Befehl label finden Sie in der HTML Referenz unter <label>.