Boja gb. Boja u stilovima može se odrediti na različite načine: heksadecimalnom vrijednošću, imenom, u RGB, RGBA, HSL, HSLA formatu

Kodovi boja u CSS-u koriste se za određivanje boja. Obično se kodovi boja ili vrijednosti boja koriste za postavljanje boje ili za prvi plan element (na primjer, boja teksta, poveznica) ili za pozadinu elementa (boja pozadine, blok). Također se mogu koristiti za promjenu boje gumba, obruba, markera, lebdenja i drugih ukrasnih efekata.

Možete postaviti svoje vrijednosti boja raznih formata. Sljedeća tablica navodi sve moguće formate:

Navedeni formati detaljnije su opisani u nastavku.

CSS boje - heksadecimalni kodovi

Heksadecimalni kod boje je šesteroznamenkasti prikaz boje. Prve dvije znamenke (RR) predstavljaju crvenu vrijednost, sljedeće dvije predstavljaju zelenu vrijednost (GG), a posljednje dvije predstavljaju plavu vrijednost (BB).

CSS boje - kratki heksadecimalni kodovi

Kratki heksadecimalni kod boje je kraći oblik zapisa od šest znakova. U ovom formatu, svaka znamenka se ponavlja kako bi se proizvela ekvivalentna šesteroznamenkasta vrijednost boje. Na primjer: #0F0 postaje #00FF00.

Heksadecimalna vrijednost može se uzeti iz bilo koje grafike softver, kao što je Adobe Photoshop, Core Draw, itd.

Svakom heksadecimalnom kodu boje u CSS-u prethodit će hash znak "#". Ispod su primjeri korištenja heksadecimalnih zapisa.

CSS boje - RGB vrijednosti

RGB vrijednost je kod boje koji se postavlja korištenjem svojstva rgb(). Ovo svojstvo ima tri vrijednosti: po jednu za crvenu, zelenu i plavu. Vrijednost može biti cijeli broj, od 0 do 255 ili postotak.

Bilješka: Ne podržavaju svi preglednici svojstvo boje rgb(), stoga se ne preporučuje njegovo korištenje.

Ispod je primjer koji prikazuje više boja koristeći RGB vrijednosti.

Generator koda boja

Pomoću naše usluge možete stvoriti milijune kodova boja.

Boje sigurne za preglednik

Ispod je tablica od 216 boja koje su najsigurnije i neovisne o računalu. Te se boje u CSS-u kreću od 000000 do FFFFFF heksadecimalnog koda. Sigurni su za korištenje jer osiguravaju da sva računala ispravno prikazuju boje kada rade s paletom od 256 boja.

Za određivanje boja koriste se heksadecimalni brojevi. Heksadecimalni sustav, Za razliku od decimalni sustav, temelji se, kao što mu ime kaže, na broju 16. Brojevi će biti sljedeći: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E , F. Brojevi od 10 do 15 zamijenjeni latiničnim slovima. Brojevi veći od 15 u heksadecimalnom sustavu nastaju spajanjem dva broja u jedan. Na primjer, broj 255 u decimali odgovara broju FF u heksadecimali. Da ne bude zabune pri određivanju brojevnog sustava, prije heksadecimalni broj stavite simbol #, na primjer #666999. Svaka od tri boje - crvena, zelena i plava - može imati vrijednosti od 00 do FF. Dakle, simbol boje je podijeljen na tri komponente #rrggbb, gdje prva dva simbola označavaju crvenu komponentu boje, srednja dva - zelenu, a posljednja dva - plavu. Dopušteno je koristiti skraćeni oblik #rgb, gdje svaki znak treba udvostručiti. Dakle, unos #fe0 treba smatrati #ffee00.

Imenom

Preglednici podržavaju neke boje prema njihovom nazivu. U tablici 1 prikazuje imena, heksadecimalni kod, vrijednosti u RGB format, HSL i opis.

Korištenje RGB-a

Boju možete definirati pomoću vrijednosti crvene, zelene i plave u decimalnom obliku. Svaka od tri komponente boje ima vrijednost od 0 do 255. Također je dopušteno navesti boju kao postotak, pri čemu 100% odgovara broju 255. Prvo navedite ključnu riječ rgb, a zatim navedite komponente boje u zagradama , odvojene zarezima, na primjer rgb(255 , 128, 128) ili rgb(100%, 50%, 50%).

RGBA

Format RGBA sličan je sintaksi RGB-u, ali uključuje alfa kanal koji određuje prozirnost elementa. Vrijednost 0 odgovara puna transparentnost, 1 je neprozirnost, a srednja vrijednost poput 0,5 je prozirnost.

RGBA je dodan u CSS3, tako da se CSS kod mora provjeriti u odnosu na ovu verziju. Treba napomenuti da je standard CSS3 još uvijek u razvoju i da se neke značajke mogu promijeniti. Na primjer, boja u RGB formatu dodana svojstvu boje pozadine je potvrđena, ali ona dodana svojstvu pozadine više nije važeća. U isto vrijeme, preglednici sasvim ispravno razumiju boju za oba svojstva.

HSL

Ime HSL format nastalo od kombinacije prvih slova Hue (boja), Saturate (zasićenost) i Lightness (svjetlina). Nijansa je vrijednost boje na kotaču boja (slika 1) i daje se u stupnjevima. 0° odgovara crvenoj, 120° zelenoj, a 240° plavoj boji. Vrijednost nijanse može varirati od 0 do 359.

Riža. 1. Kotačić boja

Zasićenost je intenzitet boje i mjeri se u postotku od 0% do 100%. Vrijednost od 0% označava odsustvo boje i nijansu sive, 100% maksimalna vrijednost zasićenost.

Svjetlina određuje koliko je boja svijetla i navedena je kao postotak od 0% do 100%. Niske vrijednosti čine boju tamnijom, a visoke vrijednosti čine boju svjetlijom; ekstremne vrijednosti od 0% i 100% odgovaraju crno-bijeloj boji.

HSLA

HSLA format sličan je sintaksi HSL-u, ali uključuje alfa kanal za određivanje transparentnosti elementa. Vrijednost 0 je potpuno prozirna, 1 je neprozirna, a srednja vrijednost poput 0,5 je poluprozirna.

Vrijednosti boja u RGBA formati, HSL i HSLA dodani su u CSS3, pa kada koristite ove formate, provjerite valjanost verzije koda.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Upozorenje

Sve metode hvatanja lavova navedene na stranici su teoretske i temeljene na računske metode. Autori ne jamče vašu sigurnost prilikom korištenja i odriču se svake odgovornosti za rezultate. Zapamtite, lav je grabežljivac i opasna životinja!

Proizlaziti ovaj primjer prikazano na sl. 2.

Riža. 2. Boje na web stranici

U HTML boja može se postaviti na tri načina:

Postavljanje boje u HTML prema njezinom nazivu

Neke se boje mogu odrediti njihovim imenom, koristeći naziv boje na Engleski jezik. Najčešći ključne riječi: crna (crna), bijela (bijela), crvena (crvena), zelena (zelena), plava (plava), itd.:

Boja teksta – crvena

Najpopularnije boje standarda Consortium Svjetska mreža(eng. World Wide Web Konzorcij, W3C):

Primjer upotrebe razne boje imena:

Primjer: navođenje boje njezinim imenom

• Probajte sami"

Zaglavlje na crvenoj pozadini

Zaglavlje na narančastoj pozadini

Naslov na pozadini limete

Bijeli tekst na plavoj pozadini

Zaglavlje na crvenoj pozadini

Zaglavlje na narančastoj pozadini

Naslov na pozadini limete

Bijeli tekst na plavoj pozadini

Određivanje boje pomoću RGB-a

Prilikom prikaza različitih boja na monitoru kao osnova se koristi RGB paleta. Bilo koja boja se dobiva miješanjem tri osnovne: R - crveno, G - zelena, B - plava. Svjetlina svake boje navedena je kao jedan bajt i stoga može poprimiti vrijednosti od 0 do 255. Na primjer, RGB(255,0,0) prikazuje se kao crvena jer je crvena postavljena na najveću visoka vrijednost(255), a ostali su postavljeni na 0. Također možete postaviti boju kao postotak. Svaki parametar označava razinu svjetline odgovarajuće boje. Na primjer: vrijednosti rgb(127, 255, 127) i rgb(50%, 100%, 50%) će postaviti isto zelene boje srednja zasićenost:

Primjer: Određivanje boje pomoću RGB-a

• Probajte sami"

rgb(127, 255, 127)

rgb (50%, 100%, 50%)

rgb(127, 255, 127)

rgb (50%, 100%, 50%)

Postavite boju prema heksadecimalnoj vrijednosti

Vrijednosti R G B također se može specificirati pomoću heksadecimalnih (HEX) vrijednosti boja u obliku: #RRGGBB gdje su RR (crveno), GG (zeleno) i BB (plavo) heksadecimalne vrijednosti od 00 do FF (isto kao decimalne 0-255 ) . Heksadecimalni sustav, za razliku od decimalnog, temelji se, kao što mu i samo ime kaže, na broju 16. Heksadecimalni sustav koristi sljedeće znakove: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Ovdje su brojevi od 10 do 15 zamijenjeni latiničnim slovima. Brojevi veći od 15 u heksadecimalnom sustavu predstavljaju se kombinacijom dva znaka u jednu vrijednost. Na primjer, najveći broj 255 u decimali odgovara najvišoj vrijednosti FF u heksadecimali. Za razliku od decimalnog sustava, heksadecimalnom broju prethodi simbol hash. # , na primjer, #FF0000 prikazana je kao crvena jer je crvena postavljena na najveću vrijednost (FF), a ostale boje na minimalnu vrijednost (00). Znakovi iza simbola hash # Možete upisivati ​​i velika i mala slova. Heksadecimalni sustav omogućuje vam korištenje skraćenog oblika #rgb, gdje je svaki znak ekvivalent dvostrukom. Stoga bi se unos #f7O trebao smatrati #ff7700.

Primjer: HEX boja

• Probajte sami"

crvena: #FF0000

zelena: #00FF00

plava: #0000FF

crvena: #FF0000

zelena: #00FF00

plava: #0000FF

crveno+zeleno=žuto: #FFFF00

crvena+plava=ljubičasta: #FF00FF

zelena+plava=cijan: #00FFFF

Popis uobičajenih boja (naziv, HEX i RGB):

Kodovi boja (pozadine) prema zasićenosti i nijansi.