CSS yoki Cascading uslublar jadvallari, ingl. Ko'rinishni sahifaga qo'llash uchun zamonaviy veb-sayt dizayni uchun ishlatilgan. HTML HTML-sahifa tuzilishini va Javascript xatti-harakatlari bilan ishlay olsa-da, veb-saytning ko'rinishi va hissiyoti CSS domenidir. Ushbu uslublar haqida gap ketganda, ular ko'pincha tashqi uslublar jadvallari yordamida qo'llaniladi, lekin siz CSS uslublarini bitta "o'ziga xos" elementga "inline uslublar" deb nomlanuvchi usuldan foydalanib qo'llashingiz mumkin.
Inline uslublari to'g'ridan-to'g'ri sahifa HTML-da qo'llaniladigan CSS uslublari. Ushbu yondashuvga ikkala afzallik va kamchiliklar ham bor. Birinchidan, ushbu uslublarning qanday yozilishini aniq ko'rib chiqaylik.
Inline uslubi qanday yoziladi
Inline CSS stilini yaratish uchun siz uslublar xususiyatini stil sahifasida qanday bo'lishingizga o'xshashligini yozish bilan boshlaysiz, lekin barchasi bir qator bo'lishi kerak. Agar uslublar jadvalida bo'lgani kabi, bir nechta xususiyatni nuqta-vergul bilan ajrating.
fon: #ccc; rang: #fff; chegarasi: qora qora 1px;
Siz xohlagan elementning uslubi xususiyati ichidagi uslublar qatorini joylashtiring. Misol uchun, siz ushbu uslubni HTML-dagi xatboshiga qo'llashni xohlasangiz, ushbu element quyidagi kabi ko'rinadi:
Ushbu misolda bu paragraf ochiq-oydin kulrang fonda (#ccc ishlaydigan narsa), qora matn (# 000 rangdan) va 1-piksel qattiq qora chegara bilan, .
Inline uslublarining afzalliklari
Cascading Style Sheet inline uslublari kaskadi tufayli bir hujjatda yuqori ustunlik yoki xoslik mavjud. Buning ma'nosi, ular sizning tashqi uslublaringizda nimaga buyurilgan bo'lsa-da, qo'llaniladi (birgina istisnosiz, ushbu varaqning muhim deklaratsiyasi berilgan uslublar bo'lsa-da, lekin agar bu ishlab chiqarish saytlarida oldini olish mumkin).
Inline uslublariga qaraganda yuqori ustunlikka ega bo'lgan yagona uslublar o'quvchilarning o'zlari tomonidan qo'llaniladigan foydalanuvchi uslublari . O'zgartirishlaringizni amalga oshirishda muammolarga duch kelsangiz, elementdagi satr ichidagi uslubni o'rnatishga urinib ko'rishingiz mumkin. Agar siz hali ham satr ichidagi uslubni aks ettirmasangiz, unda yana bir narsa borligini bilasiz.
Kiritilgan uslublar oson va tez qo'shilishi mumkin va siz to'g'ridan-to'g'ri siz o'zgartirmoqchi bo'lgan elementga uslublar qo'shayotganingizdan (bu element asosan tashqi uslublar jadvalida yozadigan selektorning o'rnini bosadi) muvofiq CSS tanlash vositasini yozishdan tashvishlanishingizga hojat yo'q ). Sizga yangi hujjat (tashqi uslublar jadvallarida bo'lgani kabi) yaratish yoki hujjatning boshidagi yangi elementni (ichki uslublar jadvallari kabi) tahrirlashning hojati yo'q. Siz deyarli har bir HTML elementida tegishli bo'lgan uslublar xususiyatini qo'shasiz. Bularning barchasida inline uslublarini ishlatish vasvasasi bo'lishi mumkin, ammo siz ushbu yondashuvga nisbatan juda muhim kamchiliklarning xabardor bo'lishingiz kerak.
Inline Styles'ning kamchiliklari
Inline uslublari ular kaskadda eng aniq bo'lganligi sababli, ular siz istamagan narsalarni tashkillashtira oladi. CSS-ning eng qudratli jihatlaridan birini ham rad etadilar - kelajakdagi yangilanishlar va uslublar o'zgarishini boshqarish uchun ancha osonroq qilish uchun ko'pgina veb-sahifalar va CSS-lardan bir nechta veb-sahifalarni tarash qobiliyati.
Agar siz faqat inline uslublarini ishlatishingiz kerak bo'lsa, sizning hujjatlaringiz tez shishiradi va uni saqlash juda qiyin bo'ladi. Buning sababi inline uslublar siz xohlagan har bir elementga qo'llanilishi kerak. Shunday qilib, barcha xatboshilaringizning "Arial" shrift turiga ega bo'lishini xohlasangiz, hujjatning har bir
tegiga inline uslubi qo'shishingiz kerak. Bu esa, ham dizaynerlar uchun parvarishlash ishlarini va o'quvchi uchun yuklab olish vaqtini qo'shib qo'yadi, chunki bu sizning shrift turini o'zgartirish uchun saytingizdagi har bir sahifaga o'zgartirish kerak bo'ladi. Shu bilan bir qatorda, agar siz alohida uslublar jadvalidan foydalansangiz, uni bir joyga o'zgartirib, har bir sahifada ushbu yangilashni olishingiz mumkin.
Haqiqatan ham, bu veb-dizayndagi orqaga qadamdir - tagidagi kunlarni qaytaring!
Inline uslubidagi boshqa kamchiliklar - bu yolg'onchi-elementlarni va ular bilan sinxronlashning mumkin emasligi. Misol uchun, tashqi uslublar jadvallari bilan siz tashrif buyuradigan, hover, faol va bog'langan yorliqning rangini taraytirasiz, lekin ichki uslubda barcha uslublaringiz linkni o'zi bo'lishi mumkin, chunki bunday uslub xususiyati shu bilan bog'lanadi .
Natijada, veb-sahifalarimiz uchun inline uslublarini ishlatishni tavsiya qilamiz , chunki ular muammoga sabab bo'ladi va sahifalarni saqlab qolish uchun ko'proq ishlarni amalga oshiradi. Biz ularni ishlatishdan faqatgina, biz taraqqiyot vaqtida uslubni tez tekshirib ko'rishni xohlaymiz. Biror elementni to'g'ri ko'rib chiqsak, biz uni tashqi uslublar jadvaliga o'tkazamiz.
Jennifer Kryninning orijinal maqolasi. Jeremy Girard tomonidan tahrirlangan.