Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #00bfff und Farbwert #fa8072

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 #00bfff			Schriftfarbwert #fa8072
Detail	:	Hintergrund #00bfff	Detail	:	Schrift #fa8072
Farbwert	:	#00bfff	Farbwert	:	#fa8072
Farbe	:	deepskyblue	Farbe	:	salmon
HTML	:	#00bfff	HTML	:	#fa8072
HTML (Wert)	:	#00bfff	HTML (Wert)	:	#fa8072
CSS	:	#00bfff	CSS	:	#fa8072
CSS (Wert)	:	#00bfff	CSS (Wert)	:	#fa8072
CSS (kürzest)	:	#00bfff	CSS (kürzest)	:	#fa8072
CSS (RGB)	:	rgb(0,191,255)	CSS (RGB)	:	rgb(250,128,114)
CSS (%RGB)	:	rgb(0%,74%,100%)	CSS (%RGB)	:	rgb(98%,50%,44%)

Verlauf Hintergrundfarbwert #00bfff nach Schriftfarbwert #fa8072
#00bfff	#23b6ea	#47add6	#6ba4c2	#8e9bae	#b2929a	#d68986	#fa8072
#00bfff	#23b6ea	#47add6	#6ba4c2	#8e9bae	#b2929a	#d68986	#fa8072

Kombination von #00bfff und #fa8072
Cras vestibulum tristique erat, ac interdum justo cursus in. 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.				#fa8072 ist nicht als Schriftfarbe auf Hintergrund #00bfff geeignet. Die Unterschiede in der Helligkeit und Farbe sind unzureichend. Die Ähnlichkeit der Farben #fa8072 und #00bfff beträgt 94.39%. Die Lesbarkeit dieser Kombination liegt damit bei 5.61%.

Hintergrundfarbwert #00bfff				Schriftfarbwert #fa8072
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#00bfff	#00bfff	#00bfff	#00bfff	#fa8072	#fa8072	#fa8072	#fa8072
#24c8ff	#24c8ff	#00a3da	#00a3da	#fa9286	#fa9286	#d66d61	#d66d61
#48d1ff	#48d1ff	#0088b6	#0088b6	#fba49a	#fba49a	#b25b51	#b25b51
#6ddaff	#6ddaff	#006d91	#006d91	#fcb6ae	#fcb6ae	#8e4941	#8e4941
#91e3ff	#91e3ff	#00516d	#00516d	#fcc8c2	#fcc8c2	#6b3630	#6b3630
#b6ecff	#b6ecff	#003648	#003648	#fddad6	#fddad6	#472420	#472420
#daf5ff	#daf5ff	#001b24	#001b24	#feecea	#feecea	#231210	#231210
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #00bfff und Farbwert #fa8072

Zebra-Effekt mit Tag td

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man von einem so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <td> mit den Hintergrundfarben Farbwert #00bfff und Farbwert #fa8072.

<style type="text/css"><!--
  td.ung { 
    background-color: #00bfff;
  }
  td.ger { 
    background-color: #fa8072;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr><td class="ung">Ga/a</td><td class="ger">Gb/a</td><td class="ung">Gc/a</td></tr>
<tr><td class="ung">Ga/b</td><td class="ger">Gb/b</td><td class="ung">Gc/b</td></tr>
<tr><td class="ung">Ga/c</td><td class="ger">Gb/c</td><td class="ung">Gc/c</td></tr>
</table>

Weiteres zum Thema td erfahren Sie in Tabellen in HTML. Zur Beschreibung des hier verwendeten Befehl <td>.

Wechsel der Umrandung bei Hover mit Tag fieldset

Die Rahmenfarbe soll sich von Farbwert #00bfff auf Farbwert #fa8072 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <fieldset> in Farbwert #00bfff vor.

In diesem Beispiel umranden wir <fieldset> mit einem 1 Pixel dicken, gezahnten Rahmen in Farbwert #00bfff.

<style type="text/css"><!--
  fieldset { 
    border-color:#00bfff; 
    border-style:ridge; 
    border-width:1px;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Rahmenfarbe auf #fa8072 geändert wird.

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

Weiteres zum Thema können Sie in Formulare in HTML nachsehen. Weiteres zum Tag <fieldset>.