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

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

Verlauf Hintergrundfarbwert #ff1493 nach Schriftfarbwert #adff2f
#ff1493	#f33584	#e75776	#db7868	#d09a59	#c4bb4b	#b8dd3d	#adff2f
#ff1493	#f33584	#e75776	#db7868	#d09a59	#c4bb4b	#b8dd3d	#adff2f

Kombination von #ff1493 und #adff2f
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 id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in.				#adff2f ist nicht als Schriftfarbe auf Hintergrund #ff1493 geeignet. Die Unterschiede in der Helligkeit und Farbe sind zu gering. Die Ähnlichkeit der Farben #adff2f und #ff1493 ergibt sich zu 85.88%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 14.12%.

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

Beispiele zur Kombination von Farbwert #ff1493 und Farbwert #adff2f

Text- und Unterstreichungsfarben mit Befehl a

Mit HTML-Tag <a> erzeugen Sie einen Link. Diesen können Sie hervorheben und farblich gestalten.

Hier ändern wir die Textfarbe von <a> auf Farbwert #adff2f und lassen die Hintergrundfarbe unverändert. Die Schriftart setzen wir auf courier new. Die Schriftgröße ändern wir auf 13px. Wir unterstreichen den Inhalt von <a> mit Hilfe eines doppelten Rahmens mit 1 Pixel Dicke in Farbwert #ff1493. Mit HTML ist dies kaum möglich. Wir nutzen deshalb CSS.

<style type="text/css"><!--
  a { 
    border-bottom-style: double; 
    color: #adff2f; 
    border-bottom-color: #ff1493; 
    font-size: 13px; 
    border-bottom-width: 1px; 
    font-family: courier new;
  }
//-->
</style>

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

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML erfahren. Der hier genutzte Tag a ist in der HTML Referenz unter <a> genau gezeigt.

Wechsel der Umrandung bei Hover bei Befehl td

Die Rahmenfarbe soll sich von Farbwert #ff1493 auf Farbwert #adff2f ändern, wenn man mit der Maus auf <td> zeigt. Bereiten wir zunächst die Formatierung von <td> in Farbwert #ff1493 vor.

In diesem Beispiel umranden wir <td> mit einem 2 Pixel dicken, gestrichelten Rahmen in Farbwert #ff1493.

<style type="text/css"><!--
  td { 
    border-style:dashed; 
    border-color:#ff1493; 
    border-width:2px;
  }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Rahmenfarbe zu #adff2f ändert.

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

Weiteres zum Thema können Sie in Tabellen in HTML finden. Weiteres zum hier genutzten Tag td ist in der HTML Referenz unter <td> zusammengestellt.