Svojstva boja CSS-a. Kodovi boja

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

Naslov

Svojstvo boje određuje boju elementa. 145 CSS naslova je uključeno u CSS. Među njima su jednostavni (na primjer, crni, plavi) i složeni (na primjer, grimizna, zakonska).
Budući da se cijeli popis pamti, imena u stilskom listu se rijetko koriste.

RGB

Većina televizora, pametnih telefona i monitora radi s RGB modelom boja. Odnosno, bilo koji ton može se postaviti kombinacijom osnovnih boja, koje uključuju crvenu, zelenu i plavu. Ovaj pristup se koristi u uređajima, kao iu CSS-u. Boje glavnog sastava zauzimaju vrijednosti od 0 do 255. Broj mogućih nijansi je jedan od 16777216.


Budući da je RGB model izravno povezan s fizičkim zakonitostima prikazivanja boja, crno je u njemu navedeno kao rgb (000), bijelo - rgb (255255255). Sustav RGBA potpuno je analogan RGB-u, samo uz dodavanje alfa kanala. To utječe na prozirnost koja miješa nijansu s pozadinskom pločom. U tom slučaju, izgled elementa će varirati ovisno o "podlozi".

HSL

Da biste razumjeli kako HLS sustav funkcionira, morate osigurati kolo boja. U njegovom središtu nalazi se crvena, zatim (u smjeru kazaljke na satu) sve ostale nijanse duge. Za definiranje CSS boja pomoću HLS sustava potrebno je postaviti tri parametra:
  • nijansu (u stupnjevima) - smjer iz središta kruga;
  • Zasićenje (kao postotak),koliko je boja potrebno;
  • svjetlina (kao postotak).
  • Na primjer, ljubičasta se može definirati na sljedeći način: hsl (315100%, 45%). HSL je najpogodniji za pokuse. Učeći kotačić boja, možete približno prikazati boju određene stavke kada gledate stilsku tablicu. # Hsla-color hsla - isti HLS, samo s alfa kanalom: hsl (0100%, 5006) - crvena, prozirna malo više od polovice.


    HEX

    U CSS-u, boja se može odrediti pomoću heksadecimalnog prikaza, primjerice, narančasta je postavljena na # FF4500. Radi boljeg razumijevanja heksadecimalnog prikaza, dublje se razmatra decimalni sustav. Sadrži brojeve od 0 do 9. Kada je potreban broj, u broj se dodaje još jedan, a zatim 10 onda 100, itd. U heksadecimalnom sustavu sve je potpuno isto, ali nakon 9 slijedi A i B i F - isto kao i 15 u decimalnom sustavu. Zatim se doda jedna znamenka, a rezultat je 10 jednak 16 u našem uobičajenom računu.
    Kao i kod RGB-a, nijanse u HEX-u pokazuju koje razmjere koriste glavne boje. U tom slučaju nisu odvojeni zarezima (boja: # FFD500). Svaka dva znaka određuju broj crvene, zelene i plave. U pravilu, HEX sustav se ne koristi tijekom eksperimenata, jer je nemoguće odabrati potrebne CSS boje. Tablica može pomoći u ovom slučaju, ali ako stalno provjerite s njom, posao će biti odgođen. Heksadecimalno prikazivanje je najprikladnije za prijenos predloška iz grafičkog urednika. Mnogo je lakše kopirati samo s njegajedna znamenka od jedne po tri.

    Koji je najbolji način?

    O tome nema ništa konkretno reći. Ako elementi sučelja zahtijevaju transparentnost, odaberite između RGBA i # hsla-color hsla. Ako želite eksperimentirati u pregledniku, HLS kotačić će biti najpogodniji. Ako koristite paletu ili prenosite dizajn Photoshopa, trebali biste preferirati heksadecimalne CSS boje.

    Povezane publikacije