HTML matn rangini qanday o'zgartirish mumkin. HTML shrift rangi Htmldagi so'zlarning rangi qanday o'zgartiriladi
Saytdagi shrift rangini HTML kod yordamida sozlash mumkin. Buning uchun teg mavjud shrift. Ta'rifga ko'ra, teg shrift matn uchun o'ziga xos "o'rash" yoki "konteyner" bo'lib xizmat qiladi, uning xususiyatlarini nazorat qilish orqali siz matn dizaynini o'zgartirishingiz mumkin.
teg shrift quyidagicha amal qiladi:
Veb-sayt yaratuvchisi "Nubex"
HTML-da shrift rangini o'zgartirishning eng oson yo'li atributdan foydalanishdir rang teg shrift:
Veb-sayt yaratuvchisi "Nubex"
Bu teg bilan o'ralgan so'z uchun ko'k rangni o'rnatadi shrift.
Lekin rang parametridan tashqari teg boshqa atributlarga ham ega.
FONT teg atributlari
teg shrift faqat uchta xususiyatga ega:
- rang- matn rangini o'rnatadi;
- hajmi- matn hajmini o'rnatadi;
- yuz- shriftlar turkumini belgilaydi.
Parametr rang rang nomi (masalan, “qizil”, “ko‘k”, “yashil”) yoki o‘n oltilik kod (masalan, #fa8e47) bilan belgilanishi mumkin.
Xususiyat hajmi 1 dan 7 gacha qiymatlarni qabul qilishi mumkin (standart 3, Times New Roman shrifti uchun 13,5 nuqtaga to'g'ri keladi). Atributni ko'rsatishning yana bir varianti - "+1" yoki "-1". Bu shuni anglatadiki, o'lcham bazaga nisbatan mos ravishda 1 ga ko'proq yoki kamroq o'zgaradi.
Keling, misolimizda ushbu atributlardan foydalanishni ko'rib chiqaylik:
Veb-sayt yaratuvchisi "Nubex"
Biz tegni qo'llaymiz shrift bir so'z uchun biz uni 6 o'lchamga, to'q sariq rangga va "Serif" shrift oilasiga o'rnatdik.
CSS yordamida matn rangini sozlash
Agar siz matnning bir nechta joylariga maxsus formatlashni (masalan, matn rangini o'zgartirish) qo'llashingiz kerak bo'lsa, u holda CSS kodidan foydalanish maqsadga muvofiq bo'ladi. Buning uchun rang atributi mavjud. Keling, buni misolimizda qanday ishlatishni ko'rib chiqaylik:
Konstruktor saytlar "Nubex"
Bu erda biz "Dizayner" so'zi uchun ko'k rangni (uning o'lchami, sukut bo'yicha, asosning 100% ni tashkil qiladi), yashil rang va "saytlar" so'zi uchun 125% o'lchamini, to'q sariq rangni va o'lchamini o'rnatdik. "Nubex" so'zi uchun 150%.
Html-da shrift rangini qanday o'zgartirish mumkin
Agar sizda veb-texnologiyalar bo'yicha bilimingiz bo'lsa, shuni bilishingiz kerakki, hujjatning barcha belgilari va mazmuni html faylida joylashgan va CSS uslubidagi fayl turli elementlarning ko'rinishini aniqlaydigan uslublarni saqlaydi. Shunday qilib, biz shrift rangini va boshqa narsalarni o'zgartirish uchun CSS dan foydalanishimiz kerak.
Html-da matnga ma'lum effektlarni qo'llash imkonini beruvchi teglar mavjud, ammo tan olishingiz kerakki, har bir soya uchun yuzlab teglar bilan kelish mutlaqo mantiqiy emas. CSS-da siz buni ancha qulayroq boshqarishingiz mumkin. Masalan, html korpus elementi, ya'ni ekranda ko'rsatiladigan sahifaning butun mazmunini o'z ichiga olgan teg uchun shrift rangini shunday o'rnatishingiz mumkin.
tanasi (rang: qizil; )
tanasi ( rang: qizil; |
Biz sahifaning asosiy qismiga qizil rangni tayinladik. Paragraflar, ro'yxatlar, sarlavhalar va boshqa barcha elementlar uni oladi. Bu elementlar uchun uslublar boshqalar uchun qayta aniqlanmaguncha sodir bo'ladi.
Rangli yozish formatlari
Ehtimol, siz veb-dizayn haqida ma'lumotga egasiz? Bunday holda, siz turli xil rang rejimlari mavjudligini bilishingiz kerak. Masalan, rgb, rgba, hsl, hex va boshqalar. Albatta, ohangni o'rnatishning eng oson yo'li oddiygina kalit so'zni yozishdir. Biz buni yuqoridagi misolda qildik, qizil qiymat harflarni qizil, ko'k - ko'k, jigarrang - jigarrang qiladi. Bu faqat ingliz tilidagi gullar nomlari.
Bu holatda bilishingiz kerak bo'lgan yagona narsa - kerakli rangning nomi. Siz ularni Internetda istalgan jadvalda ko'rishingiz mumkin. Rangni belgilashning keyingi mashhur usuli - uning o'n oltilik kodini yozish. Bu hex formati deb ataladi. Misollar:
p( rang: #000; ) /* Paragraflardagi matn qora rangda bo'ladi. */ table( color: #fff; ) /* Jadvallardagi tarkib oq rangda bo'ladi. */
Ko'rib turganingizdek, siz gridni, so'ngra rang kodini yozishingiz kerak. Uni qanday tanib olish mumkin? Masalan, siz Photoshop yoki boshqa har qanday grafik muharrirni ochishingiz mumkin, unda rang tanlashda uning olti burchakli kodi ko'rsatiladi. Onlayn xizmatdan ham foydalanishingiz mumkin.
RGB - boshqa mashhur yozish formati. Bu shunchaki qizil, yashil, ko'kni anglatadi. Ushbu formatdagi rang quyidagicha o'rnatiladi:
#footer(rang: rgb(234, 22, 56); )
#footer( rang: rgb(234, 22, 56); |
Id altbilgisi bo'lgan element belgilangan rangni oladi. Qizilning ulushi 234, yashil - 22, ko'k - 56 bo'ladi. Bu qiymatlar 0 dan 255 gacha yozilishi mumkin. Shunga ko'ra, bizning soyamiz qizilga yaqinroq bo'ladi. Paint-da siz uchta asosiy rangning to'yinganligini o'zgartirib, palitrangizga ranglar qo'shishingiz mumkin.
Ushbu usulning afzalligi shundaki, siz millionlab ranglardan faqat uchta raqamni o'zgartirish orqali tanlashingiz mumkin. Kalit so'zlardan foydalangan holda yozishda sizning arsenalingizda faqat bir necha yuz rang bo'ladi.
Rgba - shaffof matn!
Ha, bu grafik muharrirlarda uzoq vaqtdan beri mavjud bo'lgan yangi yozish rejimi, ammo u veb-dizaynda nisbatan yaqinda paydo bo'ldi. Bu shunday yozilgan:
a( rgba(255, 12, 22, 0,5); )
rgba(255, 12, 22, 0,5); |
Yozuvdagi oxirgi raqam shaffoflikni belgilaydi. U 0 dan 1 gacha yozilishi mumkin, bu erda 1 mutlaqo shaffof bo'lmagan matn, ya'ni standart xatti-harakatlar. Bunday holda, barcha havolalar qizil rangga aylanadi, lekin shaffoflik tufayli rangning yorqinligi ancha past bo'ladi va havola ostida boshqa fon yoki element mavjud bo'lsa, u ko'rinadi.
Rangni o'rnatishning noto'g'ri usuli
HTML eskirgan rang atributiga ega va u kalit so'z yordamida matn rangini yozib olish uchun ishlatilishi mumkin. Endi bu hatto zamonaviy brauzerlarda ham ishlamasligi mumkin va umuman olganda bu usul umumiy qabul qilingan veb-standartlarni buzadi. Va bu ham noqulay.
O'zboshimchalik bilan parcha uchun rangni qanday aniqlash mumkin
Xo'sh, biz paragraflar, havolalar va jadvallar uchun shrift rangi haqida gapirayapmiz, lekin bu qattiq elementlar, ammo bitta jumla, bitta so'z, bitta harf uchun rang belgilashingiz kerak bo'lsa-chi?
Biz shunchaki kerakli fragmentni span teglariga o'rab olamiz. Teg ichiga sinf atributini yozamiz, unga ixtiyoriy, ammo tushunarli qiymatni o'rnatamiz. Masalan, bu kabi:
Hammasi shu, endi CSS-dagi selektorga kirishgina qoladi.