Element Selektor
Element selektor - bu htmldagi biror bir elementni belgilash va unga turli xil
ko‘rinish uchun ishlatiladi. Quyidagi misolda p elementi belgilanadi va html dagi
barcha p elementi berilgan qiymatni oladi.
p {
color: red;
text-align: center;
}
Id selektor
263
Id selektor htmldagi biror elementning id sini belgilab unga ko‘rinish
berishda ishlatiladi. Bizga ma'lumki, id takrorlanmas bo‘lishi kerak. Shu qatori, id
selektor web sahifadagi o‘ziga xos «id» ini belgilaydi. Id maxsus hash kod orqali
belgilanadi ya'ni (#) belgi orqali.
#para1 {
text-align: center;
color: red;
}
Klas selektor
Klas selektor bu htmldagi elementni aniq bir qiymatini belgilab olish uchun
ishlatiladi. «Class selector» nuqta (.) bilan boshlanishi kerak. Masalan aytaylik biror
klasning «center» qiymatini olaylik.
#para1 {
text-align: center;
color: red;
}
Quyida
elementni klasiga oid misolni ko‘ramiz.
p.center {
text-align: center;
color: red;
}
Guruh selektor
Agar sizda bir nechta elementga bir xil ko‘rinish bermoqchi bo‘lsangiz
quyidagicha yoziladi:
h1 {
text-align: center;
color: red;
}
264
h2 {
text-align: center;
color: red;
}
p {
text-align: center;
color: red;
}
Ko‘rib turganizdek bir xil kodni 3 marta yozib chiqdik, buni qisqartirish yo‘li
mavjud. Uni quyidagicha yozamiz.
h1, h2, p {
text-align: center;
color: red;
}
Har elementdan keyin vergul va bitta bo‘sh joy qolishi kerak. Aks holda
yozilgan kod ishlamaydi.
CSS da izohlar
CSS da kodlarga izoh yozishimiz mumkin. Bu bizga birmuncha qulayliklar
beradi. Masalan, siz guruh bo‘lib ishlayabsiz, siz yozgan kodlarni boshqalar
yaxshiroq tushuna olishi uchun izohlardan foydalanasiz va bu qidirishni ham
osonlashtiradi. Izohlar /* bilan boshlanib */ bilan tugaydi.
p {
color: red;
/* Men izohman, bu yerda hohlagancha yozishingiz mumkin, meni yaxshi
tamonim, foydalanuvchilarga ko‘rinmayman. */
text-align: center;
}
|
