von Thomas Salvador.
Farben werden in HTML entweder mit ihrem Namen oder mit ihrem Wert beschrieben.
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 lightpink | Schriftfarbe mediumseagreen | |||||
| Detail | : | Hintergrund lightpink | Detail | : | Schrift mediumseagreen | |
| Farbe | : | lightpink | Farbe | : | mediumseagreen | |
| Farbwert | : | #ffb6c1 | Farbwert | : | #3cb371 | |
| HTML | : | lightpink | HTML | : | mediumseagreen | |
| HTML (Wert) | : | #ffb6c1 | HTML (Wert) | : | #3cb371 | |
| CSS | : | lightpink | CSS | : | mediumseagreen | |
| CSS (Wert) | : | #ffb6c1 | CSS (Wert) | : | #3cb371 | |
| CSS (kürzest) | : | #ffb6c1 | CSS (kürzest) | : | #3cb371 | |
| CSS (RGB) | : | rgb(255,182,193) | CSS (RGB) | : | rgb(60,179,113) | |
| CSS (%RGB) | : | rgb(100%,71%,75%) | CSS (%RGB) | : | rgb(23%,70%,44%) | |
Verlauf Hintergrundfarbe lightpink nach Schriftfarbe mediumseagreen | |||||||
| #ffb6c1 | #e3b5b5 | #c7b5aa | #abb49e | #8fb493 | #73b387 | #57b37c | #3cb371 |
| #ffb6c1 | #e3b5b5 | #c7b5aa | #abb49e | #8fb493 | #73b387 | #57b37c | #3cb371 |
Kombination von lightpink und mediumseagreen | |||||||
| Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. | mediumseagreen ist nicht als Schriftfarbe auf Hintergrund lightpink geeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind ausreichend. Die Ähnlichkeit der Farben mediumseagreen und lightpink beträgt 92.32%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 7.68%. | ||||||
Hintergrundfarbe lightpink | Schriftfarbe mediumseagreen | ||||||
| Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
| #ffb6c1 | #ffb6c1 | #ffb6c1 | #ffb6c1 | #3cb371 | #3cb371 | #3cb371 | #3cb371 |
| #ffc0c9 | #ffc0c9 | #da9ca5 | #da9ca5 | #57bd85 | #57bd85 | #339960 | #339960 |
| #ffcad2 | #ffcad2 | #b68289 | #b68289 | #73c899 | #73c899 | #2a7f50 | #2a7f50 |
| #ffd5db | #ffd5db | #91686e | #91686e | #8fd3ad | #8fd3ad | #226640 | #226640 |
| #ffdfe4 | #ffdfe4 | #6d4e52 | #6d4e52 | #abdec2 | #abdec2 | #194c30 | #194c30 |
| #ffeaed | #ffeaed | #483437 | #483437 | #c7e9d6 | #c7e9d6 | #113320 | #113320 |
| #fff4f6 | #fff4f6 | #241a1b | #241a1b | #e3f4ea | #e3f4ea | #081910 | #081910 |
| #ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Hier ändern wir die Textfarbe von <th> auf Farbe mediumseagreen und die Hintergrundfarbe von <th> auf Farbe lightpink. Die Schriftart setzen wir auf verdana. Als Schriftgröße entscheiden wir uns für 129%.
<style type="text/css"><!-- th { color: mediumseagreen; font-size: 129%; background-color: lightpink; font-family: verdana; } //--> </style>
Mehr zum Thema finden Sie in Tabellen in HTML. Die Beschreibung vom Tag th finden Sie in der HTML Referenz unter <th>.
Die Textfarbe soll sich von Farbe lightpink auf Farbe mediumseagreen ändern, wenn man mit der Maus auf <code> zeigt. Bereiten wir zunächst eine Darstellung von <code> in Farbe lightpink vor.
Zum Beispiel legen wir Farbe lightpink als Textfarbe von <code> fest.
<style type="text/css"><!-- code { color: lightpink; } //--> </style>Nun fordern wir, dass bei Berührung mit der Maus die Textfarbe auf mediumseagreen gesetzt wird.
<style type="text/css"><!-- code:hover { color:mediumseagreen; } //--> </style>
Mehr zum Thema code können Sie in Text in HTML lesen. Weiteres zum hier genutzten HTML-Befehl code ist in der HTML Referenz bei <code> genau zusammengestellt.