Kaskadli uslublar jadvali (CSS) - bu veb -saytlarni kodlash tizimi bo'lib, dizaynerlarga guruhlarga ma'lum elementlarni tayinlash orqali bir vaqtning o'zida bir nechta funktsiyalarni boshqarishga imkon beradi. Masalan, veb -sayt fonining kodini ishlatib, dizaynerlar CSS -faylga bitta o'zgartirish bilan veb -saytning barcha sahifalaridagi fon rangini yoki tasvirini o'zgartirishi mumkin. Bu erda asosiy veb -sayt uchun CSS -ni yaratish.
Qadamlar
4 -qismning 1 -qismi: Inline CSS yozish
Qadam 1. HTML teglari haqida asosiy tushunchaga ega ekanligingizga ishonch hosil qiling
Siz teglar qanday ishlashini bilishingiz kerak
src
va
href
atributlar.
2 -qadam. CSS -ning asosiy xususiyatlarini bilib oling
Siz juda ko'p mulklar borligini topasiz. Biroq, ularning hammasini o'rganish shart emas.
-
Ba'zi yaxshi CSS xususiyatlarini bilish kerak
rang
va
shrift oilasi
- .
3 -qadam. Har bir tegishli mulk uchun qadriyatlar haqida bilib oling
Barcha xususiyatlar qiymatga muhtoj. Uchun
rang
mulk, masalan, qo'yishingiz mumkin
qizil
qiymat.
4 -qadam. Haqida bilib oling
uslub
HTML atributi.
Kabi element ichida ishlatiladi
href
yoki
src
. Uni ishlatish uchun, tenglik belgisidan keyin tirnoq ichiga CSS atributini, ikki nuqta va keyin mulk qiymatini qo'ying. Bu CSS qoidasi sifatida tanilgan.
5 -qadam. Inline CSS odatda professional veb -ishlab chiquvchilar tomonidan veb -saytlar uchun ishlatilmasligini tushuning
Inline CSS HTML hujjatiga keraksiz tartibsizliklarni qo'shishi mumkin. Biroq, bu CSS qanday ishlashini bilishning ajoyib usuli.
4 -qismning 2 -qismi: Asosiy CSS -ni yozish
Qadam 1. Siz foydalanmoqchi bo'lgan dasturni ishga tushiring
Bu sizga HTML va CSS fayllarini yaratishga imkon beradi.
Agar sizda maxsus dastur o'rnatilmagan bo'lsa, siz Notepad yoki boshqa matn muharriridan foydalanishingiz mumkin. Faqat faylni CSS va matnli fayl sifatida saqlang
Qadam 2. Veb -saytingiz uchun HTML faylini oching
Buni HTML tahrirlovchisi bilan ochish kerak, agar sizda o'rnatilgan bo'lsa.
HTML muharrirlari sizga HTML va CSS -ni bir vaqtning o'zida tahrir qilish imkonini beradi
3 -qadam. HTML boshingizda teg yarating
Bu sizga CSS -ni alohida faylga ehtiyoj sezmasdan yozish imkonini beradi.
4 -qadam. Styling qo'shmoqchi bo'lgan elementni tanlang va element nomini, so'ngra jingalak qavslar to'plamini ({}) kiriting
Kodni yanada aniqroq qilish uchun har doim ikkinchi jingalak qavsni o'z qatoriga qo'ying.
5 -qadam. Qavslar orasiga CSS qoidalarini, xuddi ishlatganingizdek kiriting
uslub
xususiyat.
Har bir satr nuqta -vergul bilan tugashi kerak (;). Sizning kodingizni o'qiy olish uchun har bir qoida o'z satridan boshlanishi va har bir satrga chiziq qo'yilishi kerak.
Shuni ta'kidlash kerakki, ushbu uslub sahifadagi tanlangan turdagi barcha elementlarga ta'sir qiladi. Keyinchalik aniq uslublar keyingi bo'limda muhokama qilinadi
4 -qismning 3 -qismi: Kengaytirilgan CSS
Qadam 1. HTML faylini emas, CSS faylini yarating va uni yordamida saqlang
.css
kengaytma
HTML faylingizni ham oching.
Qadam 2. HTML boshingizda teg yarating
Bu sizga alohida CSS faylini HTML hujjatingizga ulash imkonini beradi. Sizning havola tegingiz uchta xususiyatga ega bo'lishi kerak:
rel
turi
va
href
-
rel
"munosabatlar" degan ma'noni anglatadi va brauzerga HTML hujjati bilan qanday aloqasi borligini aytadi. Bu erda uning qiymati bo'lishi kerak
"uslublar jadvali"
- .
-
turi
qaysi turdagi media bilan bog'langanligini aytadi. Bu erda uning qiymati bo'lishi kerak
"matn/CSS"
-
href
- Bu erda u elementda qanday ishlatilgan bo'lsa, xuddi shunday ishlatiladi, lekin bu erda u CSS -faylga bog'lanishi kerak. Agar CSS fayli HTML fayli bilan bir papkada joylashgan bo'lsa, faqat fayl nomi tirnoq ichida yozilishi kerak.
Qadam 3. Xuddi shu uslubni qo'shmoqchi bo'lgan har xil turdagi elementlarni tanlang
Bir qo'shing
sinf
ushbu elementlarga atribut qo'ying va ularni siz tanlagan sinf nomiga tenglashtiring. Bu sizning elementlaringizga bir xil uslubni beradi.
4 -qadam. Sinf qanday uslubni olishini belgilang
Sinf nomini CSS -dagi fayldan oldin nuqta (.) Bilan yozing (ya'ni.
.sinf
).
5 -qadam. Maxsus uslublar qo'shmoqchi bo'lgan bitta elementni tanlang va
id
xususiyat.
Idlar CSS -da nuqta emas, balki funt belgisi (#) yordamida yaratilgan.
Idlar sinflarga qaraganda aniqroq, shuning uchun identifikator har qanday sinf uslubini bekor qiladi, agar u sinfdan boshqa qiymatga ega bo'lsa
4dan 4 qism: Ko'proq ma'lumot
Qadam 1. w3 maktablariga tashrif buyuring
Bu veb -ishlab chiqish ko'nikmalarini o'rgatishga qaratilgan rasmiy veb -sayt. W3 -da HTML va CSS -ga, shuningdek boshqa veb -tillarga havola qilingan ko'plab manbalar mavjud.
2 -qadam. Maxsus HTML va CSS -ni o'rganish va o'qitishga qaratilgan boshqa saytlarni toping
CSS tricks.com kabi saytlar CSS va veb -dizayn ko'nikmalarini o'rgatishga qaratilgan. Nufuzli manbalarni topish sizga o'qish yo'lida yordam beradi.
3 -qadam. Veb -dizaynerlar va ishlab chiquvchilar bilan bog'laning
Ularning tajribasi va nou-xau sizga qimmatli bilim va ko'nikmalarni o'rgatishi mumkin.
Qadam 4. Siz duch kelgan veb -saytlarning manba kodini ko'ring
Yaxshi ishlab chiqilgan veb-saytlarning CSS-larini ko'rish sizga veb-saytlarning qismlarini loyihalash usullarini ko'rsatishi mumkin. Buni amaliyot sifatida nusxalash va kodni topish sizga CSS -ning turli atributlaridan foydalanishni o'rganishga yordam beradi.