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, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.
Hintergrundfarbe honeydew | Schriftfarbe darkred | |||||
Detail | : | Hintergrund honeydew | Detail | : | Schrift darkred | |
Farbe | : | honeydew | Farbe | : | darkred | |
Farbwert | : | #f0fff0 | Farbwert | : | #8b0000 | |
HTML | : | honeydew | HTML | : | darkred | |
HTML (Wert) | : | #f0fff0 | HTML (Wert) | : | #8b0000 | |
CSS | : | honeydew | CSS | : | darkred | |
CSS (Wert) | : | #f0fff0 | CSS (Wert) | : | #8b0000 | |
CSS (kürzest) | : | #f0fff0 | CSS (kürzest) | : | #8b0000 | |
CSS (RGB) | : | rgb(240,255,240) | CSS (RGB) | : | rgb(139,0,0) | |
CSS (%RGB) | : | rgb(94%,100%,94%) | CSS (%RGB) | : | rgb(54%,0%,0%) |
Verlauf Hintergrundfarbe honeydew nach Schriftfarbe darkred | |||||||
#f0fff0 | #e1dacd | #d3b6ab | #c49189 | #b66d66 | #a74844 | #992422 | #8b0000 |
#f0fff0 | #e1dacd | #d3b6ab | #c49189 | #b66d66 | #a74844 | #992422 | #8b0000 |
Kombination von honeydew und darkred | |||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. | Die Ähnlichkeit von darkred und honeydew beträgt 53.99%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 46.01%. darkred eignet sich als Schriftfarbe auf Hintergrund honeydew. Sowohl der Helligkeitsunterschied als auch der Unterschied in den Farben sind ok. |
Hintergrundfarbe honeydew | Schriftfarbe darkred | ||||||
Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
#f0fff0 | #f0fff0 | #f0fff0 | #f0fff0 | #8b0000 | #8b0000 | #8b0000 | #8b0000 |
#f2fff2 | #f2fff2 | #cddacd | #cddacd | #9b2424 | #9b2424 | #770000 | #770000 |
#f4fff4 | #f4fff4 | #abb6ab | #abb6ab | #ac4848 | #ac4848 | #630000 | #630000 |
#f6fff6 | #f6fff6 | #899189 | #899189 | #bc6d6d | #bc6d6d | #4f0000 | #4f0000 |
#f8fff8 | #f8fff8 | #666d66 | #666d66 | #cd9191 | #cd9191 | #3b0000 | #3b0000 |
#fafffa | #fafffa | #444844 | #444844 | #ddb6b6 | #ddb6b6 | #270000 | #270000 |
#fcfffc | #fcfffc | #222422 | #222422 | #eedada | #eedada | #130000 | #130000 |
#ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Die Hintergrundfarbe soll sich von Farbe honeydew auf Farbe darkred ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <dt> in Farbe honeydew vor.
Wir legen für dieses Beispiel Farbe honeydew als Hintergrundfarbe von <dt> fest. Zwar behalten wir die Textfarbe bei, ändern jedoch die Schriftart auf verdana und setzen die Schriftgröße auf 13px:
<style type="text/css"><!-- dt { background-color: honeydew; font-size: 13px; font-family: verdana; } //--> </style>Nun fordern wir, dass sich bei Berührung mit der Maus die Hintergrundfarbe auf darkred ändert.
<style type="text/css"><!-- dt:hover { background-color:darkred; } //--> </style>
Mehr zum Thema dt erfahren Sie in Listen und Glossare in HTML. Weiteres zum HTML-Tag dt ist in der HTML Referenz unter <dt> genau zusammengestellt.