Ressourcen: 120 HTML Farbnamen - Kombination von Farbe olivedrab und Farbwert #00bfff

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 olivedrab			Schriftfarbwert #00bfff
Detail	:	Hintergrund olivedrab	Detail	:	Schrift #00bfff
Farbe	:	olivedrab	Farbwert	:	#00bfff
Farbwert	:	#6b8e23	Farbe	:	deepskyblue
HTML	:	olivedrab	HTML	:	#00bfff
HTML (Wert)	:	#6b8e23	HTML (Wert)	:	#00bfff
CSS	:	olivedrab	CSS	:	#00bfff
CSS (Wert)	:	#6b8e23	CSS (Wert)	:	#00bfff
CSS (kürzest)	:	#6b8e23	CSS (kürzest)	:	#00bfff
CSS (RGB)	:	rgb(107,142,35)	CSS (RGB)	:	rgb(0,191,255)
CSS (%RGB)	:	rgb(41%,55%,13%)	CSS (%RGB)	:	rgb(0%,74%,100%)

Verlauf Hintergrundfarbe olivedrab nach Schriftfarbwert #00bfff
#6b8e23	#5b9542	#4c9c61	#3da381	#2daaa0	#1eb1c0	#0fb8df	#00bfff
#6b8e23	#5b9542	#4c9c61	#3da381	#2daaa0	#1eb1c0	#0fb8df	#00bfff

Kombination von olivedrab und #00bfff
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				#00bfff ist nicht als Schriftfarbe auf Hintergrund olivedrab geeignet, da die Unterschiede in der Helligkeit und Farbe zu gering sind. Die Ähnlichkeit der Farben #00bfff und olivedrab ergibt sich zu 91.46%. Die Lesbarkeit dieser Farbkombination liegt damit bei 8.54%.

Hintergrundfarbe olivedrab				Schriftfarbwert #00bfff
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6b8e23	#6b8e23	#6b8e23	#6b8e23	#00bfff	#00bfff	#00bfff	#00bfff
#809e42	#809e42	#5b791e	#5b791e	#24c8ff	#24c8ff	#00a3da	#00a3da
#95ae61	#95ae61	#4c6519	#4c6519	#48d1ff	#48d1ff	#0088b6	#0088b6
#aabe81	#aabe81	#3d5114	#3d5114	#6ddaff	#6ddaff	#006d91	#006d91
#bfcea0	#bfcea0	#2d3c0f	#2d3c0f	#91e3ff	#91e3ff	#00516d	#00516d
#d4dec0	#d4dec0	#1e280a	#1e280a	#b6ecff	#b6ecff	#003648	#003648
#e9eedf	#e9eedf	#0f1405	#0f1405	#daf5ff	#daf5ff	#001b24	#001b24
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe olivedrab und Farbwert #00bfff

Wechsel der Hintergrundfarbe bei Hover mit Befehl pre

Die Hintergrundfarbe soll sich von Farbe olivedrab auf Farbwert #00bfff ändern, wenn man mit der Maus auf <pre> zeigt. Wir bereiten zunächst die Formatierung von <pre> in Farbe olivedrab vor.

Als Beispiel setzen wir bei <pre> die Hintergrundfarbe auf Farbe olivedrab und verringern die Schriftgröße auf 86%.

<style type="text/css"><!--
  pre { 
    background-color: olivedrab; 
    font-size: 86%;
  }
//-->
</style>

Nun fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf #00bfff gesetzt wird.

<style type="text/css"><!--
  pre: hover { 
    background-color: #00bfff;
  }
//-->
</style>

Mehr zu pre lesen Sie in Blockorientierte Elemente in HTML. Der hier genutzte HTML-Tag pre ist in der HTML Referenz unter <pre> beschrieben.

Text- und Unterstreichungsfarben von HTML-Befehl caption

Hier ändern wir die Textfarbe von <caption> auf Farbwert #00bfff. Die Schriftart ändern wir auf arial und vergrößern die Schriftgröße auf 123%. Wir unterstreichen den Inhalt von <caption> mit Hilfe eines doppelten Rahmens mit 3 Pixel Dicke in Farbe olivedrab. Dies geht in HTML kaum. Wir nutzen deshalb CSS.

<style type="text/css"><!--
  caption { 
    font-family: arial; 
    border-bottom: 3px double olivedrab; 
    color: #00bfff; 
    font-size: 123%;
  }
//-->
</style>

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

Mehr zu caption lesen Sie in Tabellen in HTML. Mehr zum HTML-Befehl caption lesen Sie in der HTML Referenz unter <caption>.