RGB er en forkortelse for Red Green Blue og hver farve kan ligge i intervallet 0-255. På den måde kan vi ramme præcist den farve vi har brug for.
Eksempel i CSS
h1 { color: rgb(0, 0, 255) }
NOTE: Husk altid at angive background-color når du angiver color og omvendt. Det skal til for at overholde standarden inden for CSS!Her har vi givet h1-tag'et farven blå. Fordi både rød og grøn er sat til 0, og blå er sat til maksimum, bliver farven så blå som det overhovedet er muligt!
h1 { color: rgb(0, 0, 150) }
Dette giver en mørkere blå, da vi har dæmpet lidt for mængden af blå i vores farve. Ønsker vi en lysere blå kunne vi f.eks. skrive:h1 { color: rgb(100, 100, 255) }
Andre måder at skrive farve-information på
I CSS er det også muligt at angive farverne på andre måder end den viste. I stedet for mængden 0-255, kan vi angive farverne i procent:
h1 { color: rgb(100%, 39%, 75%) }
Skulle man finde på at angive værdier som ligger uden for mængden, så sættes disse bare til den nærmest tilgængelige værdi.
Således bliver:
h1 { color: rgb(-90, 300, 60) }
tilh1 { color: rgb(0, 255, 60) }
Ligeledes med procent, så bliver:
h1 { color: rgb(140%, -10%, 0%) }
tilh1 { color: rgb(100%, 0%, 0%) }
Hexadecimaler
Hvis man er træt af at skrive rgb(bla, bla, bla) hver gang, så kan det gøres kortere vha. hexadecimaler (læs mere om det hexadecimale talsystem på http://da.wikipedia.org/ (...)).
Et hex-tal kan antage 16 værdier, fra 0-F (0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F). Bruger vi to hexadecimaler, kan vi angive en værdi mellem 0 og 255, hvilket jo er præcist hvad vi skal bruge! :)
Se på tallet 0F. Ligesom 10-tal systemet læses laveste værdi fra højre. Tallet vi har til at stå her bliver på den måde 15 (husk 0). Skriver vi 4F står der pludselig 79. 4E giver på den måde 78, osv. Jeg tror den er feset ind på lystavlen! ;)
Når man skal angive en farve vha. hex i CSS, så starter man med symbolet #. De efterfølgende tal aflæses derefter fra venstre mod højre, #RRGGBB.
h1 { color: #FF0088 }
Giver således fuld rød, ingen grøn og lidt blå.Skal man bruge præcise farver kan der også skrives:
h1 { color: #AF970C }
Men vent! Det kan gøres endnu kortere!
Tager vi det første eksempel med hexadecimaler, så kunne det forkortes til:
h1 { color: #F08 }
Det udvider din browser nemlig til #FF0088. Ligeledes bliver #45A til #4455AA.
Som en side bemærkning skal det siges at CSS er ligeglad med om du bruger små eller store bogstaver. Du kunne således godt skrive #ab5, hvis du synes det er pænere. Personligt foretrækker jeg det andet! :)
Konstanter
Det sidste vi kommer til at gennemgå er farve-konstanterne i CSS. Nu hvor du har fundet ud af hvordan hex-tal angives, kommer her en oversigt over farve-konstanterne i CSS med hexadecimaler:
Navn Hex-tal
================
aqua #00FFFF
black #000000
blue #0000FF
fuchsia #FF00FF
gray #808080
green #008000
lime #00FF00
maroon #800000
navy #000080
olive #808000
orange #FFA500
purple #800080
red #FF0000
silver #C0C0C0
teal #008080
white #FFFFFF
yellow #FFFF00
Ligeledes findes der nogle konstanter fra system-farverne som afhænger af opsætningen af dit operativ system. Disse kan du læse nærmere om på: http://www.w3.org/ (...)
Kilder
http://www.w3.org/ (...)
//hermandsen
