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

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 antiquewhite			Schriftfarbe darkviolet
Detail	:	Hintergrund antiquewhite	Detail	:	Schrift darkviolet
Farbe	:	antiquewhite	Farbe	:	darkviolet
Farbwert	:	#faebd7	Farbwert	:	#9400d3
HTML	:	antiquewhite	HTML	:	darkviolet
HTML (Wert)	:	#faebd7	HTML (Wert)	:	#9400d3
CSS	:	antiquewhite	CSS	:	darkviolet
CSS (Wert)	:	#faebd7	CSS (Wert)	:	#9400d3
CSS (kürzest)	:	#faebd7	CSS (kürzest)	:	#9400d3
CSS (RGB)	:	rgb(250,235,215)	CSS (RGB)	:	rgb(148,0,211)
CSS (%RGB)	:	rgb(98%,92%,84%)	CSS (%RGB)	:	rgb(58%,0%,82%)

Verlauf Hintergrundfarbe antiquewhite nach Schriftfarbe darkviolet
#faebd7	#ebc9d6	#dca7d5	#ce86d5	#bf64d4	#b143d4	#a221d3	#9400d3
#faebd7	#ebc9d6	#dca7d5	#ce86d5	#bf64d4	#b143d4	#a221d3	#9400d3

Kombination von antiquewhite und darkviolet
Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				Die Ähnlichkeit von darkviolet und antiquewhite beträgt 73.32%. Die Lesbarkeit dieser Kombination ergibt sich zu 26.68%. darkviolet eignet sich nicht als Schriftfarbe auf Hintergrund antiquewhite, weil der Unterschied in den Farben nicht ausreichend ist

Hintergrundfarbe antiquewhite				Schriftfarbe darkviolet
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#faebd7	#faebd7	#faebd7	#faebd7	#9400d3	#9400d3	#9400d3	#9400d3
#faeddc	#faeddc	#d6c9b8	#d6c9b8	#a324d9	#a324d9	#7e00b4	#7e00b4
#fbf0e2	#fbf0e2	#b2a799	#b2a799	#b248df	#b248df	#690096	#690096
#fcf3e8	#fcf3e8	#8e867a	#8e867a	#c16de5	#c16de5	#540078	#540078
#fcf6ed	#fcf6ed	#6b645c	#6b645c	#d191ec	#d191ec	#3f005a	#3f005a
#fdf9f3	#fdf9f3	#47433d	#47433d	#e0b6f2	#e0b6f2	#2a003c	#2a003c
#fefcf9	#fefcf9	#23211e	#23211e	#efdaf8	#efdaf8	#15001e	#15001e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe antiquewhite und Farbe darkviolet

Zebra-Effekt mit Befehl td

Man redet vom so genannten Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe genommen werden. Er unterstützt das Auge zum Beispiel die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .odd und .even für <td> mit unterschiedlichen Hintergrundfarben Farbe antiquewhite und Farbe darkviolet.

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

Diese werden dann abwechselnd angewendet.

<table>
<tr><td class="odd">W1:1</td><td class="even">W2:1</td><td class="odd">W3:1</td></tr>
<tr><td class="odd">W1:2</td><td class="even">W2:2</td><td class="odd">W3:2</td></tr>
<tr><td class="odd">W1:3</td><td class="even">W2:3</td><td class="odd">W3:3</td></tr>
</table>

Mehr zu td können Sie in Tabellen in HTML lesen. Einzelheiten vom hier verwendeten Befehl td sind in der HTML Referenz unter <td> ausführlich zusammengestellt.

Wechsel der Unterstreichung bei Hover mit HTML-Befehl legend

Die Farbe der Unterstreichung soll sich von Farbe antiquewhite auf Farbe darkviolet ändern, wenn man mit der Maus auf <legend> zeigt. Bereiten wir zunächst eine Darstellung von <legend> in Farbe antiquewhite vor.

Hier unterstreichen wir <legend> mit Hilfe eines gezahnten Rahmens mit 2 Pixel Dicke in Farbe antiquewhite.

<style type="text/css"><!--
  legend { border-bottom:2px ridge antiquewhite; }
//-->
</style>

Jetzt fordern wir, dass bei Mausberührung die Unterstreichungsfarbe auf darkviolet gesetzt wird.

<style type="text/css"><!--
  legend:hover { 
    border-bottom-color:darkviolet;
  }
//-->
</style>

Die Idee ist hierbei, verschiedene Formatierungen für Inhalt und Unterstreichung zu nutzen. Öfter sehen Sie diesen Effekt bei Verweisen. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Hierbei handelt es sich aber nicht um eine wirkliche Unterstreichung, der Text hat keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Mehr zum Thema legend finden Sie in Formulare in HTML. Weiteres zum HTML-Tag legend erfahren Sie in der HTML Referenz unter <legend>.