Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #4b0082 und Farbwert #ff0000

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.

Hintergrundfarbwert #4b0082			Schriftfarbwert #ff0000
Detail	:	Hintergrund #4b0082	Detail	:	Schrift #ff0000
Farbwert	:	#4b0082	Farbwert	:	#ff0000
Farbe	:	indigo	Farbe	:	red
HTML	:	#4b0082	HTML	:	#ff0000
HTML (Wert)	:	#4b0082	HTML (Wert)	:	#ff0000
CSS	:	#4b0082	CSS	:	#ff0000
CSS (Wert)	:	#4b0082	CSS (Wert)	:	#ff0000
CSS (kürzest)	:	#4b0082	CSS (kürzest)	:	#f00
CSS (RGB)	:	rgb(75,0,130)	CSS (RGB)	:	rgb(255,0,0)
CSS (%RGB)	:	rgb(29%,0%,50%)	CSS (%RGB)	:	rgb(100%,0%,0%)

Verlauf Hintergrundfarbwert #4b0082 nach Schriftfarbwert #ff0000
#4b0082	#64006f	#7e005c	#98004a	#b10037	#cb0025	#e50012	#ff0000
#4b0082	#64006f	#7e005c	#98004a	#b10037	#cb0025	#e50012	#ff0000

Kombination von #4b0082 und #ff0000
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Auf Hintergrund #4b0082 ist #ff0000 ungeeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit der Farben #ff0000 und #4b0082 beträgt 84.58%. Die Lesbarkeit dieser Farbkombination liegt damit bei 15.42%.

Hintergrundfarbwert #4b0082				Schriftfarbwert #ff0000
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#4b0082	#4b0082	#4b0082	#4b0082	#ff0000	#ff0000	#ff0000	#ff0000
#642493	#642493	#40006f	#40006f	#ff2424	#ff2424	#da0000	#da0000
#7e48a5	#7e48a5	#35005c	#35005c	#ff4848	#ff4848	#b60000	#b60000
#986db7	#986db7	#2a004a	#2a004a	#ff6d6d	#ff6d6d	#910000	#910000
#b191c9	#b191c9	#200037	#200037	#ff9191	#ff9191	#6d0000	#6d0000
#cbb6db	#cbb6db	#150025	#150025	#ffb6b6	#ffb6b6	#480000	#480000
#e5daed	#e5daed	#0a0012	#0a0012	#ffdada	#ffdada	#240000	#240000
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #4b0082 und Farbwert #ff0000

Text- und Unterstreichungsfarben von HTML-Befehl acronym

Hier ändern wir die Textfarbe von <acronym> auf Farbwert #ff0000. Die Schriftart setzen wir auf arial. Die Schriftgröße setzen wir auf 13px. Wir unterstreichen den Inhalt von <acronym> mit Hilfe eines gefurchten Rahmens mit 3 Punkte Dicke in Farbwert #4b0082. Dies geht in HTML kaum. Wir nutzen deshalb CSS zur Formatierung.

<style type="text/css"><!--
  acronym { 
    color: #ff0000; 
    border-bottom-width: 3pt; 
    border-bottom-style: groove; 
    font-family: arial; 
    font-size: 13px; 
    border-bottom-color: #4b0082;
  }
//-->
</style>

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

Einzelheiten des hier gezeigten HTML-Tag acronym sind in der HTML Referenz bei <acronym> genau beschrieben.

Wechsel der Textfarbe bei Hover mit Befehl h2

Mit HTML-Tag <h2> wird eine Überschrift der 2. Stufe erzeugt. Diese kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #4b0082 auf Farbwert #ff0000 ändern, wenn man mit der Maus auf <h2> zeigt. Bereiten wir zunächst eine Formatierung von <h2> in Farbwert #4b0082 vor.

Zum Beispiel ändern wir die Textfarbe von <h2> auf Farbwert #4b0082. Zwar behalten wir die Hintergrundfarbe bei, ändern jedoch die Schriftart auf monospace:

<style type="text/css"><!--
  h2 { 
    font-family: monospace; 
    color: #4b0082;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Berührung mit der Maus die Textfarbe auf #ff0000 ändert.

<style type="text/css"><!--
  h2: hover { 
    color: #ff0000;
  }
//-->
</style>

Weiteres zu h2 können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Mehr zum hier verwendeten Befehl h2 erfahren Sie in der HTML Referenz unter <h2>.