Ressourcen: 120 HTML Farbnamen - Kombination von Farbe slategray und Farbwert #ff1493

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 slategray			Schriftfarbwert #ff1493
Detail	:	Hintergrund slategray	Detail	:	Schrift #ff1493
Farbe	:	slategray	Farbwert	:	#ff1493
Farbwert	:	#708090	Farbe	:	deeppink
HTML	:	slategray	HTML	:	#ff1493
HTML (Wert)	:	#708090	HTML (Wert)	:	#ff1493
CSS	:	slategray	CSS	:	#ff1493
CSS (Wert)	:	#708090	CSS (Wert)	:	#ff1493
CSS (kürzest)	:	#708090	CSS (kürzest)	:	#ff1493
CSS (RGB)	:	rgb(112,128,144)	CSS (RGB)	:	rgb(255,20,147)
CSS (%RGB)	:	rgb(43%,50%,56%)	CSS (%RGB)	:	rgb(100%,7%,57%)

Verlauf Hintergrundfarbe slategray nach Schriftfarbwert #ff1493
#708090	#847090	#986190	#ad5191	#c14291	#d63292	#ea2392	#ff1493
#708090	#847090	#986190	#ad5191	#c14291	#d63292	#ea2392	#ff1493

Kombination von slategray und #ff1493
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. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit der Farben #ff1493 und slategray beträgt 94.69%. Die Lesbarkeit dieser Kombination liegt damit bei 5.31%. #ff1493 ist nicht als Schriftfarbe auf Hintergrund slategray geeignet. Sowohl Helligkeit als auch die Farben sind sich zu ähnlich.

Hintergrundfarbe slategray				Schriftfarbwert #ff1493
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#708090	#708090	#708090	#708090	#ff1493	#ff1493	#ff1493	#ff1493
#84929f	#84929f	#606d7b	#606d7b	#ff35a2	#ff35a2	#da117e	#da117e
#98a4af	#98a4af	#505b66	#505b66	#ff57b1	#ff57b1	#b60e69	#b60e69
#adb6bf	#adb6bf	#404952	#404952	#ff78c1	#ff78c1	#910b54	#910b54
#c1c8cf	#c1c8cf	#30363d	#30363d	#ff9ad0	#ff9ad0	#6d083f	#6d083f
#d6dadf	#d6dadf	#202429	#202429	#ffbbe0	#ffbbe0	#48052a	#48052a
#eaecef	#eaecef	#101214	#101214	#ffddef	#ffddef	#240215	#240215
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe slategray und Farbwert #ff1493

Text- und Unterstreichungsfarben von Tag label

Hier ändern wir die Textfarbe von <label> auf Farbwert #ff1493. Die Schriftart ändern wir auf arial und erhöhen die Schriftgröße auf 120%. Wir unterstreichen den Inhalt von <label> mit Hilfe eines gefurchten Rahmens mit 5 Punkte Dicke in Farbe slategray. In HTML geht das kaum. Wir nutzen daher CSS.

<style type="text/css"><!--
  label { 
    border-bottom-width:5pt; 
    border-bottom-style:groove; 
    color:#ff1493; 
    font-size:120%; 
    border-bottom-color:slategray; 
    font-family:arial;
  }
//-->
</style>

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

Weiteres zu label finden Sie in Formulare in HTML. Weiteres zum hier gezeigten HTML-Tag label ist in der HTML Referenz bei <label> genau gezeigt.

Wechsel der Umrandung bei Hover von HTML-Tag option

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

In diesem Beispiel umranden wir <option> mit einem 2 Pixel dicken, gepunkteten Rahmen in Farbe slategray.

<style type="text/css"><!--
  option { border:2px dotted slategray; }
//-->
</style>

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

<style type="text/css"><!--
  option: hover { 
    border-color: #ff1493;
  }
//-->
</style>

Mehr zum Thema finden Sie in Formulare in HTML. Die Beschreibung vom hier genutzten HTML-Tag option finden Sie in der HTML Referenz unter <option>.