Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #b22222 und Farbwert #00008b

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 #b22222			Schriftfarbwert #00008b
Detail	:	Hintergrund #b22222	Detail	:	Schrift #00008b
Farbwert	:	#b22222	Farbwert	:	#00008b
Farbe	:	firebrick	Farbe	:	darkblue
HTML	:	#b22222	HTML	:	#00008b
HTML (Wert)	:	#b22222	HTML (Wert)	:	#00008b
CSS	:	#b22222	CSS	:	#00008b
CSS (Wert)	:	#b22222	CSS (Wert)	:	#00008b
CSS (kürzest)	:	#b22222	CSS (kürzest)	:	#00008b
CSS (RGB)	:	rgb(178,34,34)	CSS (RGB)	:	rgb(0,0,139)
CSS (%RGB)	:	rgb(69%,13%,13%)	CSS (%RGB)	:	rgb(0%,0%,54%)

Verlauf Hintergrundfarbwert #b22222 nach Schriftfarbwert #00008b
#b22222	#981d31	#7f1840	#65134f	#4c0e5e	#32096d	#19047c	#00008b
#b22222	#981d31	#7f1840	#65134f	#4c0e5e	#32096d	#19047c	#00008b

Kombination von #b22222 und #00008b
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. 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.				#00008b eignet sich nicht als Schriftfarbe auf Hintergrund #b22222. Die Unterschiede in der Helligkeit und Farbe sind unzureichend. Die Ähnlichkeit der Farben #00008b und #b22222 ergibt sich zu 89.09%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 10.91%.

Hintergrundfarbwert #b22222				Schriftfarbwert #00008b
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#b22222	#b22222	#b22222	#b22222	#00008b	#00008b	#00008b	#00008b
#bd4141	#bd4141	#981d1d	#981d1d	#24249b	#24249b	#000077	#000077
#c86161	#c86161	#7f1818	#7f1818	#4848ac	#4848ac	#000063	#000063
#d38080	#d38080	#651313	#651313	#6d6dbc	#6d6dbc	#00004f	#00004f
#dea0a0	#dea0a0	#4c0e0e	#4c0e0e	#9191cd	#9191cd	#00003b	#00003b
#e9bfbf	#e9bfbf	#320909	#320909	#b6b6dd	#b6b6dd	#000027	#000027
#f4dfdf	#f4dfdf	#190404	#190404	#dadaee	#dadaee	#000013	#000013
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #b22222 und Farbwert #00008b

Wechsel der Umrandung bei Hover von Befehl colgroup

Die Rahmenfarbe soll sich von Farbwert #b22222 auf Farbwert #00008b ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <colgroup> in Farbwert #b22222 vor.

In diesem Beispiel umranden wir <colgroup> mit einem 5 Pixel dicken, doppelten Rahmen in Farbwert #b22222.

<style type="text/css"><!--
  colgroup { 
    border-color: #b22222; 
    border-style: double; 
    border-width: 5px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Rahmenfarbe auf #00008b gesetzt wird.

<style type="text/css"><!--
  colgroup: hover { 
    border-color: #00008b;
  }
//-->
</style>

Mehr zum Thema colgroup finden Sie in Tabellen in HTML. Die Beschreibung vom hier verwendeten Tag colgroup lesen Sie in der HTML Referenz unter <colgroup>.

Füllen und Umranden von HTML-Tag p

In diesem Beispiel umranden wir <p> mit einem herausstehenden, 4 Punkte dicken Rahmen in Farbwert #00008b . Die Hintergrundfarbe für <p> setzen wir auf Farbwert #b22222. Das geht mit HTML kaum. Wir nutzen daher CSS zur Formatierung.

<style type="text/css"><!--
  p { 
    border-style: outset; 
    border-width: 4pt; 
    border-color: #00008b; 
    background-color: #b22222;
  }
//-->
</style>

Weiteres zum Thema p erfahren Sie in Grundlegende Gestaltungselemente in HTML. Zur Beschreibung des HTML-Tag <p>.