CSS-da nimani anglatadi?

Cascade-da muhim ahamiyatga ega

Veb-saytlarni kodlashni o'rganishning eng yaxshi usullaridan biri boshqa saytlarning manba kodlariga qarashdir. Ushbu amaliyot, veb-dizayn kurslari , kitoblar va onlayn trening saytlari uchun juda ko'p variantlar mavjud bo'lgan kunlarda, ko'plab veb-xodimlari professionalligini o'rgangan.

Agar siz ushbu amaliyotni sinab ko'rsangiz va saytning kaskad uslublar jadvallariga (CSS) qarasangiz, bu kodda ko'rgan narsangiz - bu chiziq.

Bu degani nimani anglatadi va eng muhimi, siz ushbu uslubni uslublar jadvallaringizda qanday qilib to'g'ri ishlatasiz?

CSS kaskadida

Birinchidan, kaskad uslublar jadvallarini chindan ham kaskadli ekanligini tushunish muhimdir, ya'ni ular ma'lum tartibda joylashtirilgan. Umuman, bu uslublar brauzer tomonidan o'qiladigan tartibda qo'llaniladi degan ma'noni anglatadi. Birinchi uslub qo'llaniladi, keyin ikkinchi va boshqalar.

Shunday qilib, agar uslublar uslubi sahifasining yuqori qismida paydo bo'lsa va keyinchalik hujjatda pastga tushsa, u uslubning ikkinchi misoli keyingi emas, keyingi hollarda qo'llaniladi. Asosan, agar ikkita uslub bir xil narsalarni aytayotgan bo'lsa (demak, ular bir xil o'ziga xoslik darajasiga ega bo'lsa), unda oxirgi list berilgan.

Masalan, quyidagi uslublar uslublar jadvalida mavjudligini tasavvur qilaylik. Ilovaning birinchi uslubi qizil bo'lsa-da, paragraf matnini qora rangda ko'rsatiladi.

Buning sababi, "qora" qiymati ikkinchi o'rinda turadi. CSS yuqoridan pastga o'qilganligi sababli, yakuniy uslub "qora" bo'lib, shuning uchun u g'alaba qozonadi.

p {rangi: qizil; }
p {rangi: qora; }

Qanday! Muhim ahamiyatga ega

Keling, bu deyarli bir xil qoidalarning CSS tomonidan qanday ishlashini tushunib olsak, muhim direktivaning narsalarni biroz o'zgartirayotganiga qaraylik.

Muhim ko'rsatma siz o'zingiz sezadigan qoidalarni qo'llashda CSS-ni kuzatish usullarini eng muhim deb hisoblaydi va qo'llanilishi kerak. Muhim Direktivga ega bo'lgan qoida har doim qoida CSS hujjatida paydo bo'lganda qo'llaniladi.

Paragraf matnini har doim qizil qilish uchun yuqoridagi misoldan foydalanasiz:

p {rangi: qizil! muhim; }
p {rangi: qora; }

Endilikda "qora" qiymati ikkinchi o'rinda tursa-da, barcha matn qizil ko'rinadi. Muhim ko'rsatma kaskadning oddiy qoidalarini bekor qiladi va u uslubni juda yuqori o'ziga xoslik bilan ta'minlaydi.

Agar siz xatlarni qizil ko'rinish uchun mutlaqo zarur deb hisoblasangiz, bu uslub buni amalga oshiradi, ammo bu bu yaxshi amaliyot degani emas. Keling, siz qachon foydalanishni xohlashingiz mumkinligi haqida o'ylab ko'raylik va kerak bo'lmaganda.

Qachon foydalanish kerak!

Veb-saytni testdan o'tkazishda va disk raskadrovka qilishda muhim topshiriq juda foydali. Agar uslub nima uchun qo'llanilmayotganiga ishonchingiz komil bo'lmasa va uni spetsifikatsiya muammo bo'lishi mumkin deb hisoblasangiz, siz uni tuzatadi yoki o'zgartirmasligini ko'rish uchun sizning uslubingizga muhim deklaratsiya qo'shishingiz mumkin.

Agar siz qo'shishingiz muhim bo'lsa, uslublardagi muammolarni to'g'rilab qo'ygan bo'lsangiz, siz aniqlik masalasi ekanligini aniqladingiz. Biroq, siz bu muhim kodni tark etishni xohlamaysiz, u faqat sinov uchun mo'ljallangan.

Sinov jarayoni amalga oshirilganligi sababli, ushbu ko'rsatmalarni o'chirib tashlashingiz va sizning uslubingizni ishga solishingiz kerak bo'lgan spetsifikaga erishish uchun siz selektorni sozlashingiz kerak. Muhim siz ishlab chiqarish maydonchasiga kirmaslik kerak, qisman bu oddiy kassadni qanday o'zgartirganligi sababli.

Agar xohlagan uslubga erishish uchun siz muhim deklaratsiyaga juda og'ir suyanib ketsangiz, oxir-oqibat, muhim uslublar bilan jihozlangan uslublar varag'i bo'ladi. Siz sahifaning CSS-ni qayta ishlash usulini o'zgartirasiz. Uzoq muddatli boshqaruv nuqtai nazaridan yaxshi bo'lmagan dangasli amaliyot.

Testdan foydalanish uchun muhim yoki ba'zi holatlarda tema yoki shablon ramkasining qismi bo'lgan satr ichidagi uslubni mutlaqo bekor qilish kerak bo'lganda foydalaning.

Hatto bunday hollarda ham ushbu yondashuvdan imkon qadar kam foydalaning va kaskadni tushunadigan toza uslublar jadvallarini yozishga harakat qiling.

Foydalanuvchi uchun uslublar jadvallari

Muhim Direktiv bo'yicha yakuniy eslatma mavjud, bu tushunarli. Ushbu ko'rsatma shuningdek, veb-sahifaning foydalanuvchilariga sahifalarni ishlatish yoki o'qishni qiyinlashtiradigan uslublar jadvallarini engishga yordam berish uchun ham joriy etildi.

Odatda, agar foydalanuvchi veb-sahifalarni ko'rish uchun uslublar jadvalini belgilasa, u uslub sahifasi veb-sahifa muallifining uslublar sahifasi tomonidan bekor qilinadi. Agar foydalanuvchi stilni "muhim" deb belgilasa, bu uslub veb-sahifa muallifining uslublar jadvalini o'chirib qo'yadi, hatto muallif ham muhim qoidani belgilaydi.

Bu uslublarni aniq tarzda belgilashga muhtoj bo'lgan foydalanuvchilar uchun foydalidir. Misol uchun, kimdir foydalanadigan barcha veb-sahifalarda ko'rsatuv shrift o'lchamlarini oshirish kerak bo'lishi mumkin. O'zingiz yaratgan sahifalarda sizning "muhim!" Ko'rsatmani ishlatib, foydalanuvchilaringizning maxsus ehtiyojlarini qondirasiz.

Jeremy Girard tomonidan tahrirlangan