Ressourcen: 120 HTML Farbnamen - Kombination von Farbe palevioletred und Farbwert #ffd700

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 palevioletred			Schriftfarbwert #ffd700
Detail	:	Hintergrund palevioletred	Detail	:	Schrift #ffd700
Farbe	:	palevioletred	Farbwert	:	#ffd700
Farbwert	:	#db7093	Farbe	:	gold
HTML	:	palevioletred	HTML	:	#ffd700
HTML (Wert)	:	#db7093	HTML (Wert)	:	#ffd700
CSS	:	palevioletred	CSS	:	#ffd700
CSS (Wert)	:	#db7093	CSS (Wert)	:	#ffd700
CSS (kürzest)	:	#db7093	CSS (kürzest)	:	#ffd700
CSS (RGB)	:	rgb(219,112,147)	CSS (RGB)	:	rgb(255,215,0)
CSS (%RGB)	:	rgb(85%,43%,57%)	CSS (%RGB)	:	rgb(100%,84%,0%)

Verlauf Hintergrundfarbe palevioletred nach Schriftfarbwert #ffd700
#db7093	#e07e7e	#e58d69	#ea9c54	#efaa3f	#f4b92a	#f9c815	#ffd700
#db7093	#e07e7e	#e58d69	#ea9c54	#efaa3f	#f4b92a	#f9c815	#ffd700

Kombination von palevioletred und #ffd700
Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben #ffd700 und palevioletred beträgt 89.44%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 10.56%. Auf Hintergrund palevioletred ist #ffd700 ungeeignet. Die Helligkeit und Farben sind sich zu ähnlich.

Hintergrundfarbe palevioletred				Schriftfarbwert #ffd700
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#db7093	#db7093	#db7093	#db7093	#ffd700	#ffd700	#ffd700	#ffd700
#e084a2	#e084a2	#bb607e	#bb607e	#ffdc24	#ffdc24	#dab800	#dab800
#e598b1	#e598b1	#9c5069	#9c5069	#ffe248	#ffe248	#b69900	#b69900
#eaadc1	#eaadc1	#7d4054	#7d4054	#ffe86d	#ffe86d	#917a00	#917a00
#efc1d0	#efc1d0	#5d303f	#5d303f	#ffed91	#ffed91	#6d5c00	#6d5c00
#f4d6e0	#f4d6e0	#3e202a	#3e202a	#fff3b6	#fff3b6	#483d00	#483d00
#f9eaef	#f9eaef	#1f1015	#1f1015	#fff9da	#fff9da	#241e00	#241e00
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe palevioletred und Farbwert #ffd700

Wechsel der Textfarbe bei Hover von HTML-Befehl button

Die Textfarbe soll sich von Farbe palevioletred auf Farbwert #ffd700 ändern, wenn man mit der Maus auf <button> zeigt. Bereiten wir zunächst die Formatierung von <button> in Farbe palevioletred vor.

Wir setzen hier die Textfarbe von <button> auf Farbe palevioletred. Die Größe der Schrift verkleinern wir auf 97%.

<style type="text/css"><!--
  button { 
    font-size:97%; 
    color:palevioletred;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Berührung mit der Maus die Textfarbe auf #ffd700 ändert.

<style type="text/css"><!--
  button:hover { 
    color:#ffd700;
  }
//-->
</style>

Weiteres zu button erfahren Sie in Formulare in HTML. Weiteres zum hier gezeigten HTML-Tag button ist in der HTML Referenz unter <button> genau beschrieben.

Zebra-Effekt bei HTML-Befehl td

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man von einem Zebra-Effekt. Dieser Effekt unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <td> mit unterschiedlichen Hintergrundfarben Farbe palevioletred und Farbwert #ffd700.

<style type="text/css"><!--
  td.ungerade { 
    background-color:palevioletred;
  }
  td.gerade { 
    background-color:#ffd700;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd verwendet.

<table>
<tr><td class="ungerade">Ia-a</td><td class="gerade">Ib-a</td><td class="ungerade">Ic-a</td></tr>
<tr><td class="ungerade">Ia-b</td><td class="gerade">Ib-b</td><td class="ungerade">Ic-b</td></tr>
<tr><td class="ungerade">Ia-c</td><td class="gerade">Ib-c</td><td class="ungerade">Ic-c</td></tr>
</table>

Weiteres zum Thema können Sie in Tabellen in HTML nachsehen. Einzelheiten vom Tag td lesen Sie in der HTML Referenz unter <td>.