CSS svojstva boje. Kodovi boja

Jedan od alata za promjenu stilova web stranica je CSS boja. Postoji nekoliko načina za promjenu ove postavke. Svaka ima i prednosti i nedostatke.

ime

Boja svojstva određuje boju elementa. U CSS-u uključeno je 145 naslova. Među njima su jednostavni (na primjer crni, plavi) i složeni (na primjer crvene, lawngreen).

Budući da je cijeli popis teško zapamtiti, nazivi u listi stilova rijetko se koriste.

RGB

Većina televizora, pametnih telefona i monitora radi s RGB modelom boja. To jest, svaka sjena može se postaviti kombinacijom primarnih boja, što uključuje crvenu, zelenu i plavu boju. Ovaj pristup se koristi i na uređajima iu CSS-u. boja od osnovnog sastava uzimaju vrijednosti od 0 do 255. I broj mogućih nijansi je 16777216.

Budući da je RGB model izravno je povezana s fizičkim zakonima boje slike, crna je navedeno u njemu kao rgb (0, 0, 0), bijela - rgb (255, 255, 255). RGBA sustav potpuno je analogan RGB, samo uz dodavanje alfa kanala. To utječe na transparentnost koja kombinira nijansu s pozadinom. Izgled elementa varira ovisno o "supstratu".

HSL

Da biste razumjeli kako HLS sustav funkcionira, morate osigurati kotačić u boji. U središtu je crvena, a zatim (u smjeru kazaljke na satu) sve druge nijanse duga. Za definiciju u CSS-u boja pomoću HLS sustava, morate postaviti tri parametra:

• ton (u stupnjevima) - smjer od središta kruga -
• zasićenje (u postocima) je koliko je boja potrebna;
• svjetlina (u postocima).

Na primjer, ljubičasta se može definirati na sljedeći način: hsl (315, 100%, 45%). HSL je najprikladniji za pokuse. Proučavajući kotačić boja, možete grubo zamisliti, dok gledate stilski list, koja je boja dodijeljena određenom elementu. HSLA - isti HLS, samo kod alfa kanala: hsl (0, 100%, 50, 0,6) - crvena, prozirna nešto više od polovice.

Hex

U CSS boja može se odrediti heksadecimalnim prikazom, na primjer, narančasta vrijednost određuje # FF4500.

Radi boljeg razumijevanja onoga što u heksadecimalnom prikazu, treba dodatno razmotriti decimalni sustav. To je broj od 0 do 9. Kada se dodaje potreba računajući broj veći od 9 jedan bit, a to ispada 10, potom 100, i tako dalje. E. Sve potpuno isti u heksadecimalnom zapisu, ali u njoj nakon 9 A, onda B, i tako dalje do F - isto kao i 15 u decimalnom sustavu. Zatim dodajte jednu znamenku, a to ispada 10 od 16 u uobičajenim uvjetima.

Kao u RGB, sjene u HEX-u upućuju na razlike u primarnim bojama. Nisu odvojene zarezima (boja: # FFD500). Svaka dva znaka određuju količinu crvene, zelene i plave boje.

U pravilu, HEX sustav se ne koristi tijekom eksperimenata, jer je nemoguće pronaći pravu boju CSS. stol može pomoći u ovom pitanju, ali ako se stalno provjeravate s njom, posao će biti odgođen. Hexadecimalni prikaz je najprikladniji prilikom prijenosa predloška iz grafičkog urednika. Uostalom, puno je lakše kopirati samo jedan broj, nego naizmjenično tri.

Koji je najbolji način?

Zbog toga ne može se reći ništa konkretno. Ako elementi sučelja trebaju transparentnost, odaberite između RGBA i HSLA. Ako želite eksperimentirati u pregledniku, HLS kotačić boja će biti najprikladniji. Ako koristite paletu ili premjestite dizajn iz Photoshopa, trebali biste preferirati heksadecimalne kodove boja CSS.