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.
Hintergrundfarbwert #fffff0 | Schriftfarbe lavenderblush | |||||
| Detail | : | Hintergrund #fffff0 | Detail | : | Schrift lavenderblush | |
| Farbwert | : | #fffff0 | Farbe | : | lavenderblush | |
| Farbe | : | ivory | Farbwert | : | #fff0f5 | |
| HTML | : | #fffff0 | HTML | : | lavenderblush | |
| HTML (Wert) | : | #fffff0 | HTML (Wert) | : | #fff0f5 | |
| CSS | : | #fffff0 | CSS | : | lavenderblush | |
| CSS (Wert) | : | #fffff0 | CSS (Wert) | : | #fff0f5 | |
| CSS (kürzest) | : | #fffff0 | CSS (kürzest) | : | #fff0f5 | |
| CSS (RGB) | : | rgb(255,255,240) | CSS (RGB) | : | rgb(255,240,245) | |
| CSS (%RGB) | : | rgb(100%,100%,94%) | CSS (%RGB) | : | rgb(100%,94%,96%) | |
Verlauf Hintergrundfarbwert #fffff0 nach Schriftfarbe lavenderblush | |||||||
| #fffff0 | #fffcf0 | #fffaf1 | #fff8f2 | #fff6f2 | #fff4f3 | #fff2f4 | #fff0f5 |
| #fffff0 | #fffcf0 | #fffaf1 | #fff8f2 | #fff6f2 | #fff4f3 | #fff2f4 | #fff0f5 |
Kombination von #fffff0 und lavenderblush | |||||||
| 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. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. | lavenderblush ist nicht als Schriftfarbe auf Hintergrund #fffff0 geeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind. Die Ähnlichkeit der Farben lavenderblush und #fffff0 beträgt 94.79%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.21%. | ||||||
Hintergrundfarbwert #fffff0 | Schriftfarbe lavenderblush | ||||||
| Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
| #fffff0 | #fffff0 | #fffff0 | #fffff0 | #fff0f5 | #fff0f5 | #fff0f5 | #fff0f5 |
| #fffff2 | #fffff2 | #dadacd | #dadacd | #fff2f6 | #fff2f6 | #dacdd2 | #dacdd2 |
| #fffff4 | #fffff4 | #b6b6ab | #b6b6ab | #fff4f7 | #fff4f7 | #b6abaf | #b6abaf |
| #fffff6 | #fffff6 | #919189 | #919189 | #fff6f9 | #fff6f9 | #91898c | #91898c |
| #fffff8 | #fffff8 | #6d6d66 | #6d6d66 | #fff8fa | #fff8fa | #6d6669 | #6d6669 |
| #fffffa | #fffffa | #484844 | #484844 | #fffafc | #fffafc | #484446 | #484446 |
| #fffffc | #fffffc | #242422 | #242422 | #fffcfd | #fffcfd | #242223 | #242223 |
| #ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Die Rahmenfarbe soll sich von Farbwert #fffff0 auf Farbe lavenderblush ändern, wenn man mit der Maus auf <col> zeigt. Wir bereiten zunächst eine Darstellung von <col> in Farbwert #fffff0 vor.
In diesem Beispiel umranden wir <col> mit einem 5 Pixel dicken, herausstehenden Rahmen in Farbwert #fffff0.
<style type="text/css"><!-- col { border:5px outset #fffff0; } //--> </style>Nun stellen wir ein, dass bei Hover die Rahmenfarbe auf lavenderblush geändert wird.
<style type="text/css"><!-- col: hover { border-color: lavenderblush; } //--> </style>
Mehr zum Thema col können Sie in Tabellen in HTML nachsehen. Die Beschreibung vom Tag col erfahren Sie in der HTML Referenz unter <col>.
Bei diesem Beispiel umranden wir <button> mit einem gestrichelten, 4 Pixel dicken Rahmen in Farbe lavenderblush . Den Hintergrund von <button> setzen wir entsprechend auf Farbwert #fffff0. In HTML ist dies nicht möglich. Daher verwenden wir CSS.
<style type="text/css"><!-- button { border:4px dashed lavenderblush; background-color:#fffff0; } //--> </style>
Mehr zu button erfahren Sie in Formulare in HTML. Der Tag button ist in der HTML Referenz bei <button> genau gezeigt.