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 #ff4500 | Schriftfarbe khaki | |||||
Detail | : | Hintergrund #ff4500 | Detail | : | Schrift khaki | |
Farbwert | : | #ff4500 | Farbe | : | khaki | |
Farbe | : | orangered | Farbwert | : | #f0e68c | |
HTML | : | #ff4500 | HTML | : | khaki | |
HTML (Wert) | : | #ff4500 | HTML (Wert) | : | #f0e68c | |
CSS | : | #ff4500 | CSS | : | khaki | |
CSS (Wert) | : | #ff4500 | CSS (Wert) | : | #f0e68c | |
CSS (kürzest) | : | #ff4500 | CSS (kürzest) | : | #f0e68c | |
CSS (RGB) | : | rgb(255,69,0) | CSS (RGB) | : | rgb(240,230,140) | |
CSS (%RGB) | : | rgb(100%,27%,0%) | CSS (%RGB) | : | rgb(94%,90%,54%) |
Verlauf Hintergrundfarbwert #ff4500 nach Schriftfarbe khaki | |||||||
#ff4500 | #fc5c14 | #fa7328 | #f88a3c | #f6a150 | #f4b864 | #f2cf78 | #f0e68c |
#ff4500 | #fc5c14 | #fa7328 | #f88a3c | #f6a150 | #f4b864 | #f2cf78 | #f0e68c |
Kombination von #ff4500 und khaki | |||||||
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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. | Auf Hintergrund #ff4500 ist khaki ungeeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind gross genug. Die Ähnlichkeit von khaki und #ff4500 ergibt sich zu 87.20%. Die Lesbarkeit dieser Kombination bewerte ich mit 12.80%. |
Hintergrundfarbwert #ff4500 | Schriftfarbe khaki | ||||||
Verlauf nach Weiß | Verlauf nach Schwarz | Verlauf nach Weiß | Verlauf nach Schwarz | ||||
#ff4500 | #ff4500 | #ff4500 | #ff4500 | #f0e68c | #f0e68c | #f0e68c | #f0e68c |
#ff5f24 | #ff5f24 | #da3b00 | #da3b00 | #f2e99c | #f2e99c | #cdc578 | #cdc578 |
#ff7a48 | #ff7a48 | #b63100 | #b63100 | #f4edac | #f4edac | #aba464 | #aba464 |
#ff946d | #ff946d | #912700 | #912700 | #f6f0bd | #f6f0bd | #898350 | #898350 |
#ffaf91 | #ffaf91 | #6d1d00 | #6d1d00 | #f8f4cd | #f8f4cd | #66623c | #66623c |
#ffc9b6 | #ffc9b6 | #481300 | #481300 | #faf7de | #faf7de | #444128 | #444128 |
#ffe4da | #ffe4da | #240900 | #240900 | #fcfbee | #fcfbee | #222014 | #222014 |
#ffffff | #ffffff | #000000 | #000000 | #ffffff | #ffffff | #000000 | #000000 |
Ein Hyperlink wird mit Befehl <a> gesetzt. Er kann hervorgehoben und farblich gestaltet werden.
Hier ändern wir die Textfarbe von <a> auf Farbe khaki und die Hintergrundfarbe von <a> auf Farbwert #ff4500. Die Schriftart setzen wir auf verdana. Als Schriftgröße wählen wir 126%.
<style type="text/css"><!-- a { font-size:126%; font-family:verdana; background-color:#ff4500; color:khaki; } //--> </style>
Mehr zum Thema a können Sie in Verweise und Protokolle in HTML lesen. Beschreibung des hier gezeigten HTML-Tag <a>.
Für dieses Beispiel umranden wir <img> mit einem gestrichelten, 5 Punkte dicken Rahmen in Farbe khaki . Den Hintergrund von <img> setzen wir auf Farbwert #ff4500. Dies ist in HTML so kaum möglich. Wir nutzen deshalb CSS.
<style type="text/css"><!-- img { border:5pt dashed khaki; background-color:#ff4500; } //--> </style>
Weiteres zu img können Sie in Grafik in HTML nachsehen. Einzelheiten des Befehl <img>.