Գույների ֆորմատներ
Գույների ֆորմատները CSS ում
Համակարգչի մոնիտորները, սմարթֆոնների և tv-ների էկրանները բաղկացած են հազարավոր կետերից՝ պիքսելներից։ Երբ լույսն ընկնում է պիքսելների վրա, յուրաքանչյուրը ստանում է իր գույնը և այդպիսով էկրանի վրա հայտնվում են պատկերներ։
Երբ գույն է սահմանվում որևէ էլեմենտի, իրականում սահմանվում է պիքսելներին։
Կան երկու հիմնական տարբերակներ css-ում գույն սահմանելու համար՝ դրա անվանման կամ՝ արժեքի միջոցով։
Անվանման միջոցով՝ red, blue, green, yellow, orange և այլն:
Երբ գույնը սահմանվում է արժեքով, ապա հնարավոր է ընտրել գույնի բազմաթիվ երանգներից որևէ մեկը։ Գույնը արժեքով սահմանելու համար կան երկու հիմնական տարբերակներ՝ RGB ֆորմատով կամ 16-նիշ արժեքով։ css3-ում ավելացվել են մի քանի տարբերակներ ևս՝ RGBA, HSL, HSLA:
Գույնի անունններ
Հասանելի են 147 տեսակի գույնի անուններ։ Ամբողջ ցանկը հասանելի է հետևյալ հասցեով՝ https://htmlcolorcodes.com/color-names/
RGB RGBA
RGB ֆորմատը սահմանվում է երեք թվերով, որոնք ներկայացնում են կարմիր, կանաչ և կապույտ գույները․ դրանց խառնուրդը տալիս է վերջնական արդյունքը։
Թիվը սահմանվում է 0-ից մինչև 255:
Օրինակ նարնջագույնը կլինի հետևյալը՝ rgb(255, 128, 0)՝
p { color: rgb(255, 128, 0); }
RGBA ֆորմատը վերջում ավելացնում է ևս մեկ թիվ, որը սահմանում է գույնի թափանցիկությունը(«A» տառը RGBA -ում ալֆա կանալն է)։
Թիվը կարելի է նշել 0-ից մինչև 1: Օրինակ 0.5-ը գույնը կդարձնի կիսաթափանցիկ։
Նույն նարնջագույնը կիսաթափանցիկ տեսքով՝ rgba(255, 128, 0, 0.5)՝
p { color: rgba(255, 128, 0, 0.5); }
HSL HSLA
HSL ֆորմատով (hue, saturation, lightness) գույնը սահմանվում է երանգի(hue), հագեցվածության(saturation) և լուսավորության(lightness) հիման վրա՝
Css-ում կունենա հետևյալ տեսքը՝
p { color: hsl(23, 95%, 52%); }
Առաջին թիվը կարելի է նշել 0-ից 360, երկրորդ և երրորդ թվերը նշվում են տոկոսով 0-ից 100%:
HSLA ֆորմատը, ինչպես RGBA-ն, ավելացնում է ալֆա կանալը՝ 0-ից մինչև 1 ընկած միջակայքում՝
p { color: hsla(23, 95%, 52%, 0.5); }
16 -բիթանոց գույնի ֆորմատ
16 -բիթանոց գույնի ֆորմատը 6 սիմվոլներից բաղկացած կոդ է և սահմանվում է «#» -ով։
Css-ում նարնջագույնը կունենա հետևյալ տեսքը՝
p { color: #196d15 }
Եթե որևէ բրաուզեր չաջակցի RGBA, HSL, HSLA ֆորմատները, ապա էլեմենտն իր գույնը կժառանգի ծնող հանդիսացող էլեմենտից, կամ կսահմանվի սև գույն։ Ուստի RGBA, HSL, HSLA -ից առաջ անհրաժեշտ է ավելացնել RGB կամ ” գույնի անվանման” տեսակը(եթե նույն սելեկտորում սահմանված է նույն հատկությունը ՝ տարբեր արժեքներով, ապա առաջնահերություն կստանա վերջում նշվածը)։
Օրինակ՝
p {
color: orange;
color: hsla(23, 95%, 52%, 0.5);
}