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 springgreen | Schriftfarbe orange | |||||
| Detail | : | Hintergrund springgreen | Detail | : | Schrift orange | |
| Farbe | : | springgreen | Farbe | : | orange | |
| Farbwert | : | #00ff7f | Farbwert | : | #ffa500 | |
| HTML | : | springgreen | HTML | : | orange | |
| HTML (Wert) | : | #00ff7f | HTML (Wert) | : | #ffa500 | |
| CSS | : | springgreen | CSS | : | orange | |
| CSS (Wert) | : | #00ff7f | CSS (Wert) | : | #ffa500 | |
| CSS (kürzest) | : | #00ff7f | CSS (kürzest) | : | #ffa500 | |
| CSS (RGB) | : | rgb(0,255,127) | CSS (RGB) | : | rgb(255,165,0) | |
| CSS (%RGB) | : | rgb(0%,100%,49%) | CSS (%RGB) | : | rgb(100%,64%,0%) | |
Verlauf Hintergrundfarbe springgreen nach Schriftfarbe orange | |||||||
| #00ff7f | #24f26c | #48e55a | #6dd848 | #91cb36 | #b6be24 | #dab112 | #ffa500 |
| #00ff7f | #24f26c | #48e55a | #6dd848 | #91cb36 | #b6be24 | #dab112 | #ffa500 |
Kombination von springgreen und orange | |||||||
| Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. 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. | Die Ähnlichkeit der Farben orange und springgreen ergibt sich zu 93.01%. Die Lesbarkeit dieser Kombination liegt damit bei 6.99%. Auf Hintergrund springgreen ist orange ungeeignet, weil sich die Helligkeit und Farben zu ähnlich sind. | ||||||
Hintergrundfarbe springgreen | Schriftfarbe orange | ||||||
| Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
| #00ff7f | #00ff7f | #00ff7f | #00ff7f | #ffa500 | #ffa500 | #ffa500 | #ffa500 |
| #24ff91 | #24ff91 | #00da6c | #00da6c | #ffb124 | #ffb124 | #da8d00 | #da8d00 |
| #48ffa3 | #48ffa3 | #00b65a | #00b65a | #ffbe48 | #ffbe48 | #b67500 | #b67500 |
| #6dffb5 | #6dffb5 | #009148 | #009148 | #ffcb6d | #ffcb6d | #915e00 | #915e00 |
| #91ffc8 | #91ffc8 | #006d36 | #006d36 | #ffd891 | #ffd891 | #6d4600 | #6d4600 |
| #b6ffda | #b6ffda | #004824 | #004824 | #ffe5b6 | #ffe5b6 | #482f00 | #482f00 |
| #daffec | #daffec | #002412 | #002412 | #fff2da | #fff2da | #241700 | #241700 |
| #ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Mit HTML-Befehl <a> wird ein Link gesetzt. Diesen kann man hervorheben und farblich gestalten.
Wir ändern für dieses Beispiel die Textfarbe von <a> auf Farbe orange und die Hintergrundfarbe von <a> auf Farbe springgreen. Als Schriftart setzen wir monospace und vergrößern die Schriftgröße auf 127%.
<style type="text/css"><!-- a { font-family:monospace; background-color:springgreen; font-size:127%; color:orange; } //--> </style>
Weiteres zu a können Sie in Verweise und Protokolle in HTML erfahren. Möglichkeiten vom Befehl a sind in der HTML Referenz unter <a> genau gezeigt.