Ressourcen: 120 HTML Farbnamen - Kombination von Farbe gainsboro und Farbe skyblue

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 gainsboro			Schriftfarbe skyblue
Detail	:	Hintergrund gainsboro	Detail	:	Schrift skyblue
Farbe	:	gainsboro	Farbe	:	skyblue
Farbwert	:	#dcdcdc	Farbwert	:	#87ceeb
HTML	:	gainsboro	HTML	:	skyblue
HTML (Wert)	:	#dcdcdc	HTML (Wert)	:	#87ceeb
CSS	:	gainsboro	CSS	:	skyblue
CSS (Wert)	:	#dcdcdc	CSS (Wert)	:	#87ceeb
CSS (kürzest)	:	#dcdcdc	CSS (kürzest)	:	#87ceeb
CSS (RGB)	:	rgb(220,220,220)	CSS (RGB)	:	rgb(135,206,235)
CSS (%RGB)	:	rgb(86%,86%,86%)	CSS (%RGB)	:	rgb(52%,80%,92%)

Verlauf Hintergrundfarbe gainsboro nach Schriftfarbe skyblue
#dcdcdc	#cfdade	#c3d8e0	#b7d6e2	#abd4e4	#9fd2e6	#93d0e8	#87ceeb
#dcdcdc	#cfdade	#c3d8e0	#b7d6e2	#abd4e4	#9fd2e6	#93d0e8	#87ceeb

Kombination von gainsboro und skyblue
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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben skyblue und gainsboro ergibt sich zu 93.95%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 6.05%. skyblue eignet sich nicht als Schriftfarbe auf Hintergrund gainsboro, weil sich die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbe gainsboro				Schriftfarbe skyblue
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#dcdcdc	#dcdcdc	#dcdcdc	#dcdcdc	#87ceeb	#87ceeb	#87ceeb	#87ceeb
#e1e1e1	#e1e1e1	#bcbcbc	#bcbcbc	#98d5ed	#98d5ed	#73b0c9	#73b0c9
#e6e6e6	#e6e6e6	#9d9d9d	#9d9d9d	#a9dcf0	#a9dcf0	#6093a7	#6093a7
#ebebeb	#ebebeb	#7d7d7d	#7d7d7d	#bae3f3	#bae3f3	#4d7586	#4d7586
#f0f0f0	#f0f0f0	#5e5e5e	#5e5e5e	#cbeaf6	#cbeaf6	#395864	#395864
#f5f5f5	#f5f5f5	#3e3e3e	#3e3e3e	#dcf1f9	#dcf1f9	#263a43	#263a43
#fafafa	#fafafa	#1f1f1f	#1f1f1f	#edf8fc	#edf8fc	#131d21	#131d21
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gainsboro und Farbe skyblue

Wechsel der Textfarbe bei Hover bei HTML-Befehl s

Die Textfarbe soll sich von Farbe gainsboro auf Farbe skyblue ändern, wenn man mit der Maus auf <s> zeigt. Wir bereiten zunächst die Formatierung von <s> in Farbe gainsboro vor.

Wir legen zum Beispiel die Textfarbe von <s> auf Farbe gainsboro fest. Die Schriftgröße verringern wir auf 95S%:

<style type="text/css"><!--
  s { 
    font-size:95S%; 
    color:gainsboro;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf skyblue gesetzt wird.

<style type="text/css"><!--
  s: hover { 
    color: skyblue;
  }
//-->
</style>

Weiteres zu s lesen Sie in Text in HTML. Einzelheiten des hier gezeigten HTML-Tag s sind in der HTML Referenz bei <s> beschrieben.

Zebra-Effekt mit HTML-Tag tr

Man redet vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .even und .odd für <tr> mit unterschiedlichen Hintergrundfarben Farbe gainsboro und Farbe skyblue.

<style type="text/css"><!--
  tr.even { 
    background-color:gainsboro;
  }
  tr.odd { 
    background-color: skyblue;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd verwendet.

<table>
<tr class="even"><td>I1-1</td><td>I2-1</td><td>I3-1</td></tr>
<tr class="odd"><td>I1-2</td><td>I2-2</td><td>I3-2</td></tr>
<tr class="even"><td>I1-3</td><td>I2-3</td><td>I3-3</td></tr>
</table>

Mehr zum Thema können Sie in Tabellen in HTML erfahren. Der hier verwendete HTML-Befehl tr ist in der HTML Referenz bei <tr> gezeigt.