O‘zbekiston respublikasi oliy va o‘rta maxsus ta’lim vazirligi guliston davlat universiteti yuldashev Ulmasbek Abdubanapovich

153 
Xususiyatlar va qiymatlar juda ham ko‘p bo‘lib, ma’lumotlardan foydalanib 
barchasi bilan tanishib chiqish mumkin. Ajratgichlar ham bir nechta bo‘lib, ular:
• 
Kontekst ajratgichlari
• 
ID ajratgichi
• 
CLASS ajratgichi
• 
Parametrli ajratgichlar
• 
Standart ajratgichlar kabi turlarga bo‘linadi.
Biz

standart ajratgichini misolda qarab chiqdik. Yana bir misol:
a:visited { color: red;
}
a: link { color: blue;
}
HTML teglariga CSS ko‘rinishlarini berishning to‘rt xil usuli mavjud:
• 
Inline usuli
• 
Joriy etish usuli
• 
Import qilish usuli
• 
Fayldan yuklash usuli Inline usuliga doir misol:
Matn
Ushbu misolda “Matn” 150% o‘lchamga o‘zgaradi va markazga tekislanadi. 
Joriy etish usuli hujjatning bosh qismida, ya’ni  tegida beriladi. Misol:


Bu misolda

tegi ichidagi ma’lumotlar qizil rangda va yuqoridan 100 
piksel bilan chetlanishga ega bo‘lishi tasvirlangan. Import qilish usuliga doir misol:

154 

Bu misolga ko‘ra, butun sahifaga “misol.css” faylidagi ko‘rinishlar 
qo‘llaniladi. Fayldan yuklash usuli ko‘p qo‘llaniladi va hujjatning bosh qismida 
tegi orqali fayl ulanadi. Misol:


Bayon etilgan to‘rtta usulning bajarilishi tartibi quyidagicha:
• 
Fayldan yuklash usuli
• 
Import qilish usuli
• 
Joriy etish usuli
• 
Inline usuli
Demak, Inline usulining bajarilishi ehtimoli katta. Butun sayt uchun umumiy 
usul fayldan yuklash usuli hisoblanadi. Web-saytning bir nechta sahifasiga 
boshqalaridan farq qiladigan alohida ko‘rinish berish uchun Import qilish usuli 
qo‘llaniladi. Bitta sahifa uchun joriy etish usuli qo‘llanilishi maqsadga muvofiq. 
Inline usulini sahifa ichidagi biror abzatsni ajratib ko‘rsatish uchun qo‘llash 
mumkin.
CSS yordamida hujjat ustida harakatlanuvchi sichqon ko‘rsatgichining 
(kursor) ko‘rinishlarini o‘zgartirish mumkin. Masalan, odatdagi holatda strelka 
ko‘rinishida, matn ustida vertikal tayoqcha ko‘rinishida bo‘lishi uchun kursor 
ko‘rinishlari turlicha ko‘rsatiladi. Kursor ko‘rinishi quyidagicha beriladi.
p { cursor: pointer;
}
Kursor ko‘rinishlari va uning qiymatlari quyidagi jadvalda berilgan.
1-jadval. Kursor ko‘rinishlari

155 
61-rasm. Kursor xossasi 
Rasm ustida sichqon ko‘rsatgichining ko‘rinishi o‘zgarishi uchun quyidagi 
usullarda berilishi mumkin:
a) img {
cursor: pointer;
}
b)

Web-sahifa orqa foni rasmdan iborat bo‘lishi mumkin. Buni ham CSS 
yordamida berish mumkin. Gorizontal gradiyent fonga ega Web-sahifaga misol:
body { background: url("images/bg.jpg") repeat-x #dedede;
} bu yerda #dedede- fon rangini bildiradi. Vertikal gradiyent fonga ega Web- 
sahifaga misol:
body { background: url("images/bg.jpg") repeat-y center #dedede;
}

156 
Oddiy rasmdan iborat fonga ega Web- sahifaga misol: body {
background: url("images/bg.jpg") no-repeat #dedede; }
Animatsion GIF-fayldan foydalanib ham fon hosil qilish mumkin. Misol: html 
{
background: url(images/bg.gif) no-repeat;/* GIF-fayl */ height: 100%;/* 
sahifa balandligi */
}
CSSda bir nechta o‘lchov birliklari qo‘llaniladi. O‘lchov birligi berilishiga 
doir misol: p { font-size: 14pt;
} pt– o‘lchov birligi bo‘lib, harf kattaligi 14 punktga teng bo‘lishini anglatadi. 
Yana quyidagi o‘lchov birliklari qo‘llanilishi mumkin:
10-jadval. CSS da o‘lchov birliklari 
 
10-jadval 

Download 4,4 Mb.