Animal Trading cards

33. Amaliy mashg‘ulot - Ranglar

Kelli koddagi rang qiymatlarini aks ettirishning uch xil usulini ko‘rsatdi. Masalan:

rgb(100%, 100%, 100%)

rgb(255, 255, 255)

#ffffff

Sirtda har xil ko‘rinishga ega bo‘lishiga qaramay, ularning barchasi bir xilda ishlaydi.

Barcha holatlarda, uchta asosiy rangning har biriga:qizil, yashil va ko‘k (RGB)ning miqdorini berishimiz kerak.

1-savol

Ushbu "RGB" qiymatlarining har birini u orqali hosil bo‘lgan rangga moslang.

2-savol

Ushbu "RGB" qiymatlarining har birini u orqali hosil bo‘lgan rangga moslang.

Izoh:

E’tibor bering, bular oxirgi mashqda berilgan ranglar. 0-100% gacha bo‘lgan shkalada yoki 0-255 gacha bo‘lgan shkalada intensivlikni ifodalashimiz mumkin - ular bir xil narsani ko‘rsatishning turli xil usullari.

Yuqoridagi rasmda, agar barcha uchta ranglarning teng (va qizg‘in) darajalarini aralashtirsak, oq ranga ega bo‘lishimizga e’tibor bering. Agar uchta rangning kuchlilik darajasini teng miqdorga taqsimlasak, turli xil kul ranglarga ega bo‘lishimizni tasavvur qilishingiz mumkin.

3-savol

Ushbu "RGB" qiymatlarining har birini u orqali hosil bo‘lgan rangga moslang..

Izoh:

Rangning maksimal intensivligini 100% yoki 255 qiymatlari bilan belgilashimizga e’tibor bering.

4-savol

Ushbu "RGB" qiymatlarining har birini u orqali hosil bo‘lgan rangga moslang.

Agar "hex" qiymatining ma’lum bir rang uchun nima ekanligini aniqlashingiz kerak bo‘lsa, mavjud bo‘lgan "color picker" asboblari yordamida osongina topishingiz mumkin.

Ushbu "color picker" foydali asbobini https://www.w3schools.com/colors/colors_picker.asp sinab ko‘ring.

Rangni istagan formatda kiritishingiz mumkin va bu dastur kiritgan rangingizni boshqa ko‘rinishlarda qanday bo‘lishini chiqarib beradi("RGB" va "HEX" qiymatida yoki rang nomi siftadi).

5-savol

W3Schools color picker https://www.w3schools.com/colors/colors_picker.asp havolasi orqali boring va rgb(0%, 100%, 100%) qiymatini kiritib ko‘ring.

Ushbu rangni ifodalashimiz mumkin bo'lgan yana qanday usullar mavjud?

Video lavhada Kelli aytib o‘tgandek, agar sahifadagi elementni ko‘rsangiz va uning rangi qanday bo‘lishini bilmoqchi bo‘lsangiz, ishlab brauzeringizni "Developer Tools" imkoniyatidan foydalanishingiz mumkin.

6-savol

Quyidagi matnni tekshirish uchun "Developer Tools"dan foydalaning. Uning "RGB" qiymati nima?

What color am I?

Men qanday rangdaman?

Agar hali ham sinab ko‘rmagan bo‘lsangiz, biz namoyish etgan uch xil RGB qiymatlari bilan mashqlar qilishingizni maslahat beramiz. Quyida ularni sinab ko‘rishingiz mumkin bo‘lgan ish maydoni mavjud.

body va h1 elementlarining orqa foniga rang belgilaydigan bir nechta "CSS"ning tur selektorlari bilan bog'langan "stylesheet" faylini (ish maydonidagi ikkinchi panel) qo‘shdik. Ammo ular RGB qiymatlarini ishlatishdan ko‘ra oddiy rang so‘zlarni (black va white) ishlatganlar (shuningdek, qora va oq odatiy qiymat hisoblanib, hech qanday o‘zgarishga olib kelmaydi).

Oldinga o‘ting va black va white so‘zdan iborat qiymatlarni har xil RGB qiymatlari bilan almashtiring. O‘zingiz yoqtirgan ranglarni topish uchun [W3Schools color picker] (https://www.w3schools.com/colors/colors_picker.asp) manbasidan foydalanishingiz mumkin.