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 mediumaquamarine | Schriftfarbe mediumturquoise | |||||
| Detail | : | Hintergrund mediumaquamarine | Detail | : | Schrift mediumturquoise | |
| Farbe | : | mediumaquamarine | Farbe | : | mediumturquoise | |
| Farbwert | : | #66cdaa | Farbwert | : | #48d1cc | |
| HTML | : | mediumaquamarine | HTML | : | mediumturquoise | |
| HTML (Wert) | : | #66cdaa | HTML (Wert) | : | #48d1cc | |
| CSS | : | mediumaquamarine | CSS | : | mediumturquoise | |
| CSS (Wert) | : | #66cdaa | CSS (Wert) | : | #48d1cc | |
| CSS (kürzest) | : | #66cdaa | CSS (kürzest) | : | #48d1cc | |
| CSS (RGB) | : | rgb(102,205,170) | CSS (RGB) | : | rgb(72,209,204) | |
| CSS (%RGB) | : | rgb(40%,80%,66%) | CSS (%RGB) | : | rgb(28%,81%,80%) | |
Verlauf Hintergrundfarbe mediumaquamarine nach Schriftfarbe mediumturquoise | |||||||
| #66cdaa | #61cdae | #5dceb3 | #59ceb8 | #54cfbd | #50cfc2 | #4cd0c7 | #48d1cc |
| #66cdaa | #61cdae | #5dceb3 | #59ceb8 | #54cfbd | #50cfc2 | #4cd0c7 | #48d1cc |
Kombination von mediumaquamarine und mediumturquoise | |||||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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. | Die Ähnlichkeit der Farben mediumturquoise und mediumaquamarine ergibt sich zu 95.07%. Die Lesbarkeit dieser Kombination ergibt sich zu 4.93%. mediumturquoise eignet sich nicht als Schriftfarbe auf Hintergrund mediumaquamarine. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend. | ||||||
Hintergrundfarbe mediumaquamarine | Schriftfarbe mediumturquoise | ||||||
| Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
| #66cdaa | #66cdaa | #66cdaa | #66cdaa | #48d1cc | #48d1cc | #48d1cc | #48d1cc |
| #7bd4b6 | #7bd4b6 | #57af91 | #57af91 | #62d7d3 | #62d7d3 | #3db3ae | #3db3ae |
| #91dbc2 | #91dbc2 | #489279 | #489279 | #7cdeda | #7cdeda | #339591 | #339591 |
| #a7e2ce | #a7e2ce | #3a7561 | #3a7561 | #96e4e1 | #96e4e1 | #297774 | #297774 |
| #bde9da | #bde9da | #2b5748 | #2b5748 | #b0ebe9 | #b0ebe9 | #1e5957 | #1e5957 |
| #d3f0e6 | #d3f0e6 | #1d3a30 | #1d3a30 | #caf1f0 | #caf1f0 | #143b3a | #143b3a |
| #e9f7f2 | #e9f7f2 | #0e1d18 | #0e1d18 | #e4f8f7 | #e4f8f7 | #0a1d1d | #0a1d1d |
| #ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Eine Überschrift erzeugen Sie mit Tag <h1>. Diese kann hervorgehoben und farblich gestaltet werden.
Die Hintergrundfarbe soll sich von Farbe mediumaquamarine auf Farbe mediumturquoise ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <h1> in Farbe mediumaquamarine vor.
Wir setzen zum Beispiel die Hintergrundfarbe von <h1> auf Farbe mediumaquamarine.
<style type="text/css"><!-- h1 { background-color: mediumaquamarine; } //--> </style>Nun fordern wir, dass sich bei Mausberührung die Hintergrundfarbe auf mediumturquoise ändert.
<style type="text/css"><!-- h1: hover { background-color: mediumturquoise; } //--> </style>
Mehr zum Thema lesen Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des Tag h1 sind in der HTML Referenz unter <h1> ausführlich beschrieben.