Ressourcen: 120 HTML Farbnamen - Kombination von Farbe plum und Farbe antiquewhite

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 plum			Schriftfarbe antiquewhite
Detail	:	Hintergrund plum	Detail	:	Schrift antiquewhite
Farbe	:	plum	Farbe	:	antiquewhite
Farbwert	:	#dda0dd	Farbwert	:	#faebd7
HTML	:	plum	HTML	:	antiquewhite
HTML (Wert)	:	#dda0dd	HTML (Wert)	:	#faebd7
CSS	:	plum	CSS	:	antiquewhite
CSS (Wert)	:	#dda0dd	CSS (Wert)	:	#faebd7
CSS (kürzest)	:	#dda0dd	CSS (kürzest)	:	#faebd7
CSS (RGB)	:	rgb(221,160,221)	CSS (RGB)	:	rgb(250,235,215)
CSS (%RGB)	:	rgb(86%,62%,86%)	CSS (%RGB)	:	rgb(98%,92%,84%)

Verlauf Hintergrundfarbe plum nach Schriftfarbe antiquewhite
#dda0dd	#e1aadc	#e5b5db	#e9c0da	#edcad9	#f1d5d8	#f5e0d7	#faebd7
#dda0dd	#e1aadc	#e5b5db	#e9c0da	#edcad9	#f1d5d8	#f5e0d7	#faebd7

Kombination von plum und antiquewhite
Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit der Farben antiquewhite und plum ergibt sich zu 91.59%. Die Lesbarkeit dieser Kombination bewerte ich mit 8.41%. antiquewhite eignet sich nicht als Schriftfarbe auf Hintergrund plum, weil weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind.

Hintergrundfarbe plum				Schriftfarbe antiquewhite
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#dda0dd	#dda0dd	#dda0dd	#dda0dd	#faebd7	#faebd7	#faebd7	#faebd7
#e1ade1	#e1ade1	#bd89bd	#bd89bd	#faeddc	#faeddc	#d6c9b8	#d6c9b8
#e6bbe6	#e6bbe6	#9d729d	#9d729d	#fbf0e2	#fbf0e2	#b2a799	#b2a799
#ebc8eb	#ebc8eb	#7e5b7e	#7e5b7e	#fcf3e8	#fcf3e8	#8e867a	#8e867a
#f0d6f0	#f0d6f0	#5e445e	#5e445e	#fcf6ed	#fcf6ed	#6b645c	#6b645c
#f5e3f5	#f5e3f5	#3f2d3f	#3f2d3f	#fdf9f3	#fdf9f3	#47433d	#47433d
#faf1fa	#faf1fa	#1f161f	#1f161f	#fefcf9	#fefcf9	#23211e	#23211e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe plum und Farbe antiquewhite

Zebra-Effekt mit Tag th

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

<style type="text/css"><!--
  th.even { 
    background-color:plum;
  }
  th.odd { 
    background-color:antiquewhite;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr><td class="even">Ka~a</td><td class="odd">Kb~a</td><td class="even">Kc~a</td></tr>
<tr><td class="even">Ka~b</td><td class="odd">Kb~b</td><td class="even">Kc~b</td></tr>
<tr><td class="even">Ka~c</td><td class="odd">Kb~c</td><td class="even">Kc~c</td></tr>
</table>

Weiteres zu th können Sie in Tabellen in HTML lesen. Beschreibung des HTML-Befehl <th>.

Wechsel der Hintergrundfarbe bei Hover mit Befehl center

Die Hintergrundfarbe soll sich von Farbe plum auf Farbe antiquewhite ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <center> in Farbe plum vor.

Wir ändern z.B. bei <center> die Hintergrundfarbe auf Farbe plum. Die Textfarbe behalten wir bei, ändern jedoch die Schriftart auf courier new.

<style type="text/css"><!--
  center { 
    font-family: courier new; 
    background-color: plum;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Hintergrundfarbe zu antiquewhite ändert.

<style type="text/css"><!--
  center:hover { 
    background-color:antiquewhite;
  }
//-->
</style>

Mehr zu center können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Möglichkeiten des Befehl center erfahren Sie in der HTML Referenz unter <center>.