Farver i HTML og CSS
Postet Den: 30/08/2008 Kl: 3:57
Sidst Redigeret: 19/12/2008 Kl: 18:56
Her kan der læses teori om farvekoder, RGB til HEX, HEX til RGB, og nøgleord. Samt hvordan man bruger de forskellige koder til at angive farver i HTML og CSS. Du kan også bruge Brugbarts Farveskema Værktøj til at hjælpe med at vælge farver til din side, eller konvatere HEX til RGB.
Brugen af Farvekoder
Farvekoder bliver som regl angivet med deres hexadecimale værdier, eller deres RGB værdier. Men der findes også prædefineret nøgleord som kan bruges.
Nøgleord
Nogle farver kan angives ved deres engelske navn, eller ved brugen af nøgleord.
Bemærk. Dette er de 16 nøgleord w3c har listet.
| Black: #000000 | Green: #008000 | ||
| Gray: #808080 | Lime: #00FF00 | ||
| Silver: #C0C0C0 | Olive: #808000 | ||
| White: #FFFFFF | Yellow: #FFFF00 | ||
| Maroon: #800000 | Navy: #000080 | ||
| Red: #FF0000 | Blue: #0000FF | ||
| Porple: #800080 | Teal: #008080 | ||
| Fuchsia: #FF00FF | Aqua: #00FFFF |
Favekoder
Nedenfor ses et eksempel, på hvordan man angiver en baggrunds-farve, med de forskellige farvekoder.
body {
/* Keywords */
background: red;
/* Hex */
background: #FF0000;
/* RGB */
background: rgb(255,0,0);
}Rød Grøn Blå (RGB)
Farver består af en kombination af Rød Grøn og Blå. Når man angiver en farve med RGB indstiller man hver af disse værdier.
Eks. rgb(255,255,255);
Hver farve kan maximum have værdien 255, det giver 255*255*255 mulige farver, det svare til 16.581.375 farver, eller 24bit.
Idag kan de fleste computere, eller enheder gengive alle 16.581.375 farver, der er dog gamle computere som er begrænset til 8bit, (256 farver), de vil istedet forsøge at gengive den farve som er tættest på, rasultat farven kan variere, eksempelvis efter hvilken browser man bruger. Der er også nye enheder, eksempelvis håndholdte enheder som har et begrænset antal farver, det er ligefra nogle ganske få bits til 16 og 18 bits. Derfor er det vigtigt at overveje deres begrænsninger, når der laves noget til disse enheder.
Bemærk. Man bør normalt ikke begrænse sig selv for at understøtte disse enheder.
Hexadecimaler (hex)
Det er i reglen ikke nødvendigt at vide hvad HEX er, eller hvordan man omregner RGB til HEX. Man kan nemlig benytte stort set alle Grafiske Programmer til at finde de farver man vil bruge, der er også fave værktøjer der kan hjælpe med hurtigt at finde både RGB og HEX for en farve.
Skulle det aligevæl blive nødvendigt, så lad os lige gennemgå lidt teori. Nedestående tabel kan benyttes til at omregne RGP til HEX.
| Decimalt | Hexadecimalt |
| 0 | 0 |
| 1 | 1 |
| 2 | 2 |
| 3 | 3 |
| 4 | 4 |
| 5 | 5 |
| 6 | 6 |
| 7 | 7 |
| 8 | 8 |
| 9 | 9 |
| 10 | A |
| 11 | B |
| 12 | C |
| 13 | D |
| 14 | E |
| 15 | F |
Hvis vi bruger RGB(20, 0, 0); som eksempel, og omregner det til HEX vil vi få #140000, det skyldes at 16 er grundtal.
Eks. med tallet 14 betyder det 1 sekstener og 4 enere, hvilket sammenlagt giver 20.
Hvis vi har et Symbol/bogstav til at erstatte et tal, så bruger vi det istedet, derfor betyder #001E00 i henhold til ovenstående tabel 16+14 hvilket giver G30.
Eks. RGB(0, 30, 0);
Hvis vi nu tager et højere tal som eks 100 bliver det lidt sværere, men efter at have gennemgået ovenstående burde det sige sig selv at 100 i decimal er 64 i hex, det svare til 16*6+4. Vi tager altså rodtallet og ganger med det første HEX cifre, hvor efter vi lægger det sidste HEX cifre til.
Eks. F0 svare til 16*15+0.
Alle hexadecimale farver har 2 cifre, så hvis man skal bruge en farve under 16, skal der et nul foran.
Eks. 15 bliver til 0F, og 9 bliver til 09.
Forfatter: BlueBoden
Kommentarer: [0]
Vejledninger
Referencer
