Ressourcen: 120 HTML Farbnamen - Kombination von Farbe gainsboro und Farbwert #dda0dd

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			Schriftfarbwert #dda0dd
Detail	:	Hintergrund gainsboro	Detail	:	Schrift #dda0dd
Farbe	:	gainsboro	Farbwert	:	#dda0dd
Farbwert	:	#dcdcdc	Farbe	:	plum
HTML	:	gainsboro	HTML	:	#dda0dd
HTML (Wert)	:	#dcdcdc	HTML (Wert)	:	#dda0dd
CSS	:	gainsboro	CSS	:	#dda0dd
CSS (Wert)	:	#dcdcdc	CSS (Wert)	:	#dda0dd
CSS (kürzest)	:	#dcdcdc	CSS (kürzest)	:	#dda0dd
CSS (RGB)	:	rgb(220,220,220)	CSS (RGB)	:	rgb(221,160,221)
CSS (%RGB)	:	rgb(86%,86%,86%)	CSS (%RGB)	:	rgb(86%,62%,86%)

Verlauf Hintergrundfarbe gainsboro nach Schriftfarbwert #dda0dd
#dcdcdc	#dcd3dc	#dccadc	#dcc2dc	#dcb9dc	#dcb1dc	#dca8dc	#dda0dd
#dcdcdc	#dcd3dc	#dccadc	#dcc2dc	#dcb9dc	#dcb1dc	#dca8dc	#dda0dd

Kombination von gainsboro und #dda0dd
Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.				Die Ähnlichkeit von #dda0dd und gainsboro beträgt 92.81%. Die Lesbarkeit dieser Farbkombination liegt damit bei 7.19%. #dda0dd eignet sich nicht als Schriftfarbe auf Hintergrund gainsboro, da die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbe gainsboro				Schriftfarbwert #dda0dd
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#dcdcdc	#dcdcdc	#dcdcdc	#dcdcdc	#dda0dd	#dda0dd	#dda0dd	#dda0dd
#e1e1e1	#e1e1e1	#bcbcbc	#bcbcbc	#e1ade1	#e1ade1	#bd89bd	#bd89bd
#e6e6e6	#e6e6e6	#9d9d9d	#9d9d9d	#e6bbe6	#e6bbe6	#9d729d	#9d729d
#ebebeb	#ebebeb	#7d7d7d	#7d7d7d	#ebc8eb	#ebc8eb	#7e5b7e	#7e5b7e
#f0f0f0	#f0f0f0	#5e5e5e	#5e5e5e	#f0d6f0	#f0d6f0	#5e445e	#5e445e
#f5f5f5	#f5f5f5	#3e3e3e	#3e3e3e	#f5e3f5	#f5e3f5	#3f2d3f	#3f2d3f
#fafafa	#fafafa	#1f1f1f	#1f1f1f	#faf1fa	#faf1fa	#1f161f	#1f161f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gainsboro und Farbwert #dda0dd

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag p

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

Wir ändern in diesem Beispiel die Hintergrundfarbe von <p> auf Farbe gainsboro und vergrößern die Schriftgröße auf 123%:

<style type="text/css"><!--
  p { 
    font-size:123%; 
    background-color:gainsboro;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf #dda0dd geändert wird.

<style type="text/css"><!--
  p: hover { 
    background-color: #dda0dd;
  }
//-->
</style>

Mehr zum Thema p können Sie in Grundlegende Gestaltungselemente in HTML lesen. Beschreibung vom Befehl <p>.

Zebra-Effekt mit HTML-Befehl th

Man spricht vom so genannten Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .gerade und .ungerade für <th> mit unterschiedlichen Hintergrundfarben Farbe gainsboro und Farbwert #dda0dd.

<style type="text/css"><!--
  th.gerade { 
    background-color:gainsboro;
  }
  th.ungerade { 
    background-color: #dda0dd;
  }
//-->
</style>

Diese werden dann abwechselnd verwendet.

<table>
<tr><td class="gerade">NA.A</td><td class="ungerade">NB.A</td><td class="gerade">NC.A</td></tr>
<tr><td class="gerade">NA.B</td><td class="ungerade">NB.B</td><td class="gerade">NC.B</td></tr>
<tr><td class="gerade">NA.C</td><td class="ungerade">NB.C</td><td class="gerade">NC.C</td></tr>
</table>

Mehr zu th finden Sie in Tabellen in HTML. Der hier verwendete Befehl th ist in der HTML Referenz bei <th> gezeigt.