RGB kodi binafsha rangda. HTML matn va CSS rangini qanday o'zgartirish mumkin. Rangli model RGB

HTML rangi uchta usulda o'rnatilishi mumkin:

Men yoga uchun HTMLda rang berishni chaqiraman

Deyakí kolori í̈x uchun o'rnatilishi mumkin Men nomlayman, vikoristovuyuchi ma'nosi sifatida men rangni nomlayman Ingliz tili. Eng keng kalit so'zlar: qora (qora), oq (oq), qizil (qora), yashil (yashil), ko'k (ko'k) va ichida.

Rangli matn - qizil

Konsortsium standartiga eng mashhur ranglar Butunjahon Internet tarmog'i(English World Wide Web Consortium, W3C):

Turli xil rang nomlariga misol:

Butt: nomi uchun zavdannya rangi

• O'zingiz sinab ko'ring »

Qizil shira ustidagi sarlavha

Sarlavha to'q sariq fonda

Ohak fonida sarlavha

Qora shira ustidagi oq matn

Qizil shira ustidagi sarlavha

Sarlavha to'q sariq fonda

Ohak fonida sarlavha

Qora shira ustidagi oq matn

Yordam RGB uchun rang menejeri

Monitorda turli xil ranglarni ko'rsatishda RGB palitrasi asos qilib olinadi. Har qanday rang bormi, ular uchta asosiy narsani o'zgartirib, o'zgaradi: R - qizil (qizil), G - ko'katlar (yashil), B - ko'k (ko'k). Teri rangining intensivligi bir bayt i bilan o'rnatiladi, shuning uchun uni 0 dan 255 gacha qiymatlarga o'rnatish mumkin. Masalan, RGB (255,0,0) qizil rangda ko'rsatiladi, shuning uchun qizil rangga o'rnatiladi. ikkinchi qiymat (255), va boshqalar 0 ga o'rnatiladi Bundan tashqari, siz vodsotkovomu vídnosheny rangini o'rnatishingiz mumkin. Parametrlardan charm yaskravosty vydpovídnogo koloru ning riven ko'rsatadi. Masalan: rgb(127, 255, 127) va rgb(50%, 100%, 50%) qiymatlari o'rtacha qiymatning bir xil yashil rangini o'rnatadi:

Buttstock: yordam RGB uchun rang menejeri

• O'zingiz sinab ko'ring »

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

rgb(127, 255, 127)

rgb(50%, 100%, 50%)

O'n oltinchi qiymat uchun rang menejeri

Qiymat R G B Shuningdek, o'n oltinchi (HEX) rang qiymatlarining yordami uchun quyidagi shaklda ko'rsatilishi mumkin: #RRGGBB, de RR (chervony), GG (yashil) va BB (ko'k) ê o'n oltinchi qiymatlar 00 dan FF gacha (o'zi, o'nlab 0-255 kabi). Shestnadtsyatkov tizimi, vydminu bo'yicha o'ninchi tizim, asoslangan, bir yiplya z vv nomi sifatida, soni 16. O'n oltinchi tizimi vikoristova bunday belgilar: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E. , F Bu yerda 10 dan 15 gacha raqamlar lotin harflari bilan almashtiriladi. O'n oltinchi tizimda 15 dan katta raqamlar bitta qiymatdagi ikkita belgining birikmasidir. Masalan, o'ninchi tizimdagi eng katta 255 raqami o'n oltinchi tizimdagi eng yuqori FF qiymatini ko'rsatadi. O'ninchi tizimning yuqori qismida o'n oltinchi raqamdan oldin xesh belgisini qo'ying # , masalan, #FF0000 qizil rang sifatida paydo bo'ladi, qizil parchalar eng yuqori qiymatiga (FF) o'rnatiladi va rang o'zgarishi minimal qiymatiga (00) o'rnatiladi. Panjara belgisidan keyingi belgilar # siz ajoyib, juda kichik deb yozishingiz mumkin. O'n oltinchi tizim #rgb shaklining qisqartirilgan shaklini o'zgartirishga, pastki urushga teng bo'lgan belgini dekodlash imkonini beradi. Shunday qilib, #f7O yozuvidan keyin #ff7700 kabi o'zgarish keladi.

Qimmatli qog'oz: HEX rangli

• O'zingiz sinab ko'ring »

qizil: #FF0000

yashil: #00FF00

ko'k: #0000FF

qizil: #FF0000

yashil: #00FF00

ko'k: #0000FF

qizil+yashil=sariq: #FFFF00

qizil + ko'k = binafsha: #FF00FF

yashil+ko‘k=ko‘k: #00FFFF

Keng ranglar ro'yxati (nomi, HEX va RGB):

Rang va rang uchun kodi ranglari (fon).

Kitobning birinchi qismida, boshqa hollarda, biz CSS-da matn rangini qanday o'rnatishni allaqachon ko'rsatdik. Bu erda izchil hech narsa yo'q: sizga rangning kuchi va matnni o'zgartirish uchun foydalanishingiz mumkin bo'lgan rangning ma'nosi kerak.

P (rang: #211C18; )

Ilovada #211C18 qiymati o'n oltinchi rang kodini bildiradi. Siz allaqachon bilasiz o'n olti tizim toza, keyin keyingi xatboshini o'qishni o'tkazib yuborishingiz mumkin. Bundan tashqari, biz sizga ranglarni Internetda taqdim etishning boshqa usullari haqida ko'proq ma'lumot berdik - rangli modellar (RGB, HSL) va kalit so'zlar. Ushbu ma'lumot yangi boshlanuvchilar uchun tanish bo'ladi va o'qishdan oldin tavsiya etiladi.

O'n olti rang (olti burchakli)

O'n oltinchi sanoq tizimi ( oltilik, oltilik) soni asosida 16. O'n oltinchi qiymatni yozish uchun 16 ta belgi mavjud: 0 dan 9 gacha arab raqamlari va lotin alifbosining birinchi harflari (A, B, C, D, E, F). O'n oltilik formatdagi rang 00 dan FF gacha bo'lgan uchta ikki xonali sonda qayd etiladi (ularning oldida g'rat # belgisi qo'yilgan), bu uchta komponentni bildiradi: Qizil, Yashil, Moviy (rang modeli RGB). Aks holda, rangni #RRGGBB deb yozish mumkin, shekilli, birinchi belgilar juftligi qizil qovurg'a, ikkinchisi - yashil qovurg'a, uchinchisi - ko'k qovurg'ani anglatadi. Olingan rang uchta rangning soni.

Hex-kvitansiyalarni yozish tezligi

Deyakí sistadtsyatkoví ranglarning qiymatlarini tezda yozib olish mumkin. Keyinchalik nima qilish uchun yozuvni #RRGGBB shaklidan #RGB ga o'zgartiring. Agar olti burchakli raqamda bir xil belgilarning uchta jufti bo'lsa, g'alaba qozonishga arziydi.

Eslatmaning qisqartirilgan shakli ko'pincha yoziladi va tan olinishi uchun biz tezda bir nechta misollarni keltiramiz. Nutqdan oldin, ranglarning olti burchakli qiymatlari ro'yxatdan o'tishga sezgir emas - siz kichik harflar kabi g'alaba qozonishingiz mumkin, barchasi sizning didingizga mos keladi.

Olti burchakli tushumlarning qisqartirilgan yozuvini ilova qiling:

Rangli model RGB

CSS rangini belgilashning yana bir usuli o'nlab RGB qiymatlarini tanlashdir (Qizil, Moviy, Yashil). Buning uchun rang kuchidan keyin rgb kalit so'zini, so'ngra qo'llarda va kim orqali yozish kerak - 0 dan 255 gacha bo'lgan uchta raqam, teri qizil, yashil va ko'k ranglarning intensivligini bildiradi (r). , g, b). Raqam qanchalik katta bo'lsa, rang shunchalik kuchli bo'ladi. Masalan, yorqin yashil rangni olish uchun quyidagilarni yozish kerak:

P (rang: rgb(0, 255, 0); )

Va eksa sarg'ish-girchichny vydtinok bir xil ma'noga ega bo'lishi mumkin:

Rang: rgb(94, 81, 3); /* pastki - bir xil rang, XVI asrdagi yozuvlar ko'rinishi: */ rang: #5E5103;

Qora rangning qiymati (0, 0, 0), oq rang esa - (255, 255, 255) sifatida yoziladi. Vidsotkaning qiymatini ko'rsatishga ham ruxsat beriladi. Shunday qilib, 255 raqami 100% mos keladi, shuning uchun oq rang quyidagicha o'rnatilishi mumkin:

Rang: rgb (100%, 100%, 100%);

De shukati rang ma'nolari

Ehtimol, siz ovqatlangandirsiz: yulduzlarni oling va ranglarning barcha ma'nolarini oling? Ísnuê shaxssiz grafik muharrirlar va onlayn xizmatlar, ularning yordami uchun ranglar va rang sxemalarini tanlashingiz mumkin. Eng kattalaridan biri mashhur dasturlar, unda siz boshqa rangni tanlashingiz va bir xil RGB qiymatini tanlashingiz mumkin, hex va nafaqat - Adobe Photoshop. Shu bilan bir qatorda, maxsus saytlar mavjud bo'lib, ularda siz nafaqat rangni, balki rangni ham osongina tanlashingiz mumkin. rang sxemasi. Vizual zaxira - Adobe Color CC xizmati.

Rangli model RGBA

Rangni RGBA formatidagi kabi RGBA formatida o'rnatishingiz mumkin. RGBA ning RGB ga ko'rinishi rangning shaffofligi uchun tan olingan alfa kanalining mavjudligi bilan belgilanadi. Aniqlik 0 dan 1 gacha boʻlgan qoʻshimcha raqam uchun oʻrnatiladi, bunda 0 koʻproq ravshanlikni koʻrsatadi, 1 esa shaffoflikni bildirmaydi. 0,5 tipidagi oraliq qiymatlar shaffoflik ko'rinishini o'rnatishga imkon beradi (qisqartmalarga ruxsat beriladi, nolsiz, lekin nuqta bilan - .5). Masalan, matnni ranglar bilan kengaytirish va izlar orqali ko'rish uchun rang vakolatidan keyin rgba kalit so'zini va rangning qiymatini yozish kerak:

P (rang: rgba(94, 81, 3, .9); )

RGBA minuslari brauzerni qo'llab-quvvatlamaydiganlardir Internet Explorer 8 va undan oldingi versiya. Maxsus IE8 uchun siz quyidagi yechimni qo'llashingiz mumkin:

P (rang: rgb(94, 81, 3); rang: rgba(94, 81, 3, .9); )

Ilovadagi birinchi quvvat IE8 brauzeri uchun tan olinadi, u matnni kerakli rangda, ammo shaffofliksiz ko'rsatadi. Va o'sha brauzerlar, rozumíyut RGBA kabi, shaffoflikdan kuch do'sti elementiga zastosuyut.

Rangli modellar HSL (HSLA)

HSL rang modelining qo'shimcha koordinatalari (Hue, Saturation, Lightness - ohang, to'yinganlik, engillik) yordamida CSS-da rangni ham o'rnatishingiz mumkin. Buni shunday yozib oling:

P (rang: hsl(165, 100%, 50%); )

Yoylardagi birinchi raqam ohangni (rang) anglatadi va darajalarda o'rnatiladi (raqamlar diapazoni 0 dan 359 gacha). Koloning rangiga qarab, siz taxmin qilganingizdek, darajalarning o'zi nima uchun g'alaba qozonishini tushunishingiz oson bo'ladi:

Qo'llardagi raqamlarning qolganlari va uchdan bir qismi to'yinganlik (to'yinganlik) va engillik (engillik) degan ma'noni anglatadi. Їx qiymatlari 0 dan 100 gacha qiymatlarda o'rnatiladi. Nolga tushadigan to'yinganlik qiymati uni kulrang rangga olib keladi, agar qiymat bo'lmasa, qiymat rang bo'lishi mumkin. Yengillikning (yorug'likning) qo'shimcha qiymati uchun siz rangning yorqinligini ko'rsatishingiz mumkin. Past qiymatlar rangning quyuq soyalariga, yuqoridan och rangga olib keladi. Yengillik uchun 100% qiymati oq, 0% qora degan ma'noni anglatadi.

HSLA ning rang modeli xuddi HSL kabi ishlatilishi mumkin, ammo unda RGBA, ê alfa kanaliga o'xshab, uning yordamida turlar oralig'ida kerakli qiymatni ko'rsatib, rangning shaffofligini o'rnatishingiz mumkin. 0 dan 1 gacha:

P (rang: hsla(165, 100%, 50%, .6); )

HSL va HSLA barcha brauzerlar, jumladan, Internet tomonidan qo'llab-quvvatlanadi Explorer versiyasi 8 va undan oldingi.

Standart HTML ranglari

Internetda ranglarni taqdim etishning yana bir usuli - kalit so'zlardan foydalanish, ularning yordami uchun siz element uchun rangni belgilashingiz mumkin. Butt:

P (rang: qora; )

Rang intensivligi qiymatida yozilishi mumkin bo'lgan 16 ta standart rangdan foydalaning:

Ranglar barcha brauzerlar tomonidan qo'llab-quvvatlanadi. Bu erda turli xil rang o'zgarishlari uchun 130 ta qo'shimcha kalit so'zlar mavjud. W3C uchun bir xil ranglar jadvalini tekshirishingiz mumkin.

Bunday kalit so'zlarni tanlash maqbuldir, ammo brauzer so'zni qabul qilmasligi xavflidir. Shuning uchun kalit so'zlarni almashtirish uchun o'n oltinchi rang kodini yozish tavsiya etiladi.

Podbaglar

CSS-da matnning rangi qo'shimcha vakolat rangi uchun o'rnatiladi, chunki qiymat bir necha usulda yozilishi mumkin - hex formatida, RGB yoki HSL formatida, kalit so'zni ko'rsatib. Kalit so'z yordamida berilgan noto'g'ri rang tanlovini bartaraf qilish uchun olti burchakli qiymatni ko'rsatish yaxshiroqdir.

Qo'shimcha alfa-kanal (RGBA va HSLA formatlari) ortidagi element uchun shaffoflikni ham o'rnatishingiz mumkin. Qanday bo'lmasin, brauzer IE8 va yogo ekanligini aytish xavfsiz dastlabki versiyalari RGBA, HSL va HSLA formatlarini qo'llab-quvvatlamaydi.

CSS rang moduli ma'noni aniq tasvirlab beradi, bu mualliflarga html elementlarining rangi va shaffofligini, shuningdek rang intensivligi qiymatini belgilash imkonini beradi.

quvvat rangi

1. Ustuvor ranglar: yak_st rang

Rasmiylar shrift rangini turli xil rang uzatish tizimlari yordamida o'rnatdilar. Quvvat o'rniga matn elementining rangini aniqlaydi. Bundan tashqari, u boshqa har qanday hokimiyat uchun, masalan, rang qiymati kabi, berilgan potentsial bilvosita qiymat (currentColor) uchun g'alaba qozonadi.

Quvvat pasayadi.

2. Rangning ma’nosi

2.1. Asosiy kalit so'zlar

Asosiy kalit so'zlar ro'yxati quyidagi ma'nolarni o'z ichiga oladi:

Ro'yxatdan o'tish uchun sezgir bo'lmagan ranglarni nomlang.

Sintaksis

Rang: zangori;

2.2. Rangning raqamli ma'nosi

2.2.1. RGB model ranglari

O'n oltilik format uchun RGB qiymat formati # belgisi, undan keyin uch yoki olti o'n oltilik belgilar. Uch xonali RGB yozuvi #rgb olti xonali shaklga #rrggbb nol qo'shish orqali emas, raqamlarni nusxalash orqali o'zgartiriladi. Masalan, #fb0 #ffbb00 gacha kengayadi. Bu #ffffff #fff qisqa yozuvida ishlatilishini kafolatlaydi va siz bu displey rangining chuqurligidagi pasayish yoki yo'qligini ko'rishingiz mumkin.

Funktsional belgining RGB qiymat formati rgb(, undan keyin uchta raqamli qiymatlar ro'yxati (yoki uchta butun qiymat yoki uch yuzinchi qiymat), undan keyin belgi) . Butun son qiymati 255 100% va o'n oltinchi yozuvda F yoki FF ni bildiradi:

RGB(255,255,255) = RGB(100%, 100%, 100%) = #FFF

Bo'shliq belgilariga faqat bir nechta raqamli qiymatlar uchun ruxsat beriladi.

Bu darajada tegning qolgan atributini ko'rish mumkin , bu matnning rangini belgilaydi. Reklama matni orqasida qora rang mavjud bo'lib, u oq shira ustida ko'rsatiladi. Qilish uchun html-dagi matn rangini o'zgartirish, atributni to'xtatish kerak rang belgisi :