Ressourcen: 137 HTML Farbnamen - Kombination von Farbe blue und Farbwert #87ceeb

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.

Hintergrundfarbe blue			Schriftfarbwert #87ceeb
Detail	:	Hintergrund blue	Detail	:	Schrift #87ceeb
Farbe	:	blue	Farbwert	:	#87ceeb
Farbwert	:	#0000ff	Farbe	:	skyblue
HTML	:	blue	HTML	:	#87ceeb
HTML (Wert)	:	#0000ff	HTML (Wert)	:	#87ceeb
CSS	:	blue	CSS	:	#87ceeb
CSS (Wert)	:	#0000ff	CSS (Wert)	:	#87ceeb
CSS (kürzest)	:	#00f	CSS (kürzest)	:	#87ceeb
CSS (RGB)	:	rgb(0,0,255)	CSS (RGB)	:	rgb(135,206,235)
CSS (%RGB)	:	rgb(0%,0%,100%)	CSS (%RGB)	:	rgb(52%,80%,92%)

Verlauf Hintergrundfarbe blue nach Schriftfarbwert #87ceeb
#0000ff	#131dfc	#263af9	#3958f6	#4d75f3	#6093f0	#73b0ed	#87ceeb
#0000ff	#131dfc	#263af9	#3958f6	#4d75f3	#6093f0	#73b0ed	#87ceeb

Kombination von blue und #87ceeb
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit von #87ceeb und blue beträgt 76.51%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 23.49%. Auf Hintergrund blue ist #87ceeb ungeeignet. Zwar ist der Helligkeitsunterschied ok, die Farben selbst sind jedoch zu ähnlich.

Hintergrundfarbe blue				Schriftfarbwert #87ceeb
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#0000ff	#0000ff	#0000ff	#0000ff	#87ceeb	#87ceeb	#87ceeb	#87ceeb
#2424ff	#2424ff	#0000da	#0000da	#98d5ed	#98d5ed	#73b0c9	#73b0c9
#4848ff	#4848ff	#0000b6	#0000b6	#a9dcf0	#a9dcf0	#6093a7	#6093a7
#6d6dff	#6d6dff	#000091	#000091	#bae3f3	#bae3f3	#4d7586	#4d7586
#9191ff	#9191ff	#00006d	#00006d	#cbeaf6	#cbeaf6	#395864	#395864
#b6b6ff	#b6b6ff	#000048	#000048	#dcf1f9	#dcf1f9	#263a43	#263a43
#dadaff	#dadaff	#000024	#000024	#edf8fc	#edf8fc	#131d21	#131d21
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe blue und Farbwert #87ceeb

Wechsel der Textfarbe bei Hover von HTML-Tag address

Die Textfarbe soll sich von Farbe blue auf Farbwert #87ceeb ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <address> in Farbe blue vor.

Wir setzen als Beispiel die Textfarbe von <address> auf Farbe blue. Die Hintergrundfarbe lassen wir unverändert. Die Schriftart setzen wir auf arial. Die Größe der Schrift verringern wir auf 80%.

<style type="text/css"><!--
  address { 
    font-size: 80%; 
    color: blue; 
    font-family: arial;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Hover die Textfarbe auf #87ceeb geändert wird.

<style type="text/css"><!--
  address:hover { 
    color:#87ceeb;
  }
//-->
</style>

Mehr zum Thema address lesen Sie in Blockorientierte Elemente in HTML. Möglichkeiten des Tag <address>.

Zebra-Effekt bei Befehl tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man vom Zebra-Effekt. Der Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <tr> mit den Hintergrundfarben Farbe blue und Farbwert #87ceeb.

<style type="text/css"><!--
  tr.gerade { 
    background-color: blue;
  }
  tr.ungerade { 
    background-color:#87ceeb;
  }
//-->
</style>

Diese werden dann abwechselnd verwendet.

<table>
<tr class="gerade"><td>PA-A</td><td>PB-A</td><td>PC-A</td></tr>
<tr class="ungerade"><td>PA-B</td><td>PB-B</td><td>PC-B</td></tr>
<tr class="gerade"><td>PA-C</td><td>PB-C</td><td>PC-C</td></tr>
</table>

Mehr zum Thema können Sie in Tabellen in HTML finden. Möglichkeiten vom hier verwendeten HTML-Tag tr lesen Sie in der HTML Referenz unter <tr>.