Yangi boshlanuvchilarning vorislar selektoridagi xatosi
Quyidagi selektorga qarang:
p.eee {
color: red;
}
Siz allaqachon bilishingiz kerak, bunday selektor
eee klassiga ega abzatslarni tanlaydi. Masalan, mana bulalar:
<p class="eee">
lorem ipsum
</p>
<p class="eee">
lorem ipsum
</p>
Endi mana bu selektorga qarang:
p .eee {
color: green;
}
Bu selektor oldingisidan shu bilan farq qiladiki,
unda tegnomi va klass nomi orasida
bosh joy turadi. Bu bosh joy
vorislar selektorini ifodalaydi. Ya'ni bu holda
biz abzatslar ichida joylashgan
eee klassiga ega barcha elementlarni tanlaymiz. Masalan, bu
selektor quyidagi spanlarni tanlaydi:
<p>
lorem <span class="eee">ipsum</span>
</p>
<p>
lorem <span class="eee">ipsum</span>
</p>
Kodni bajarish natijasi:
Shunday qilib, yana bir bor: p.eee - bunday selektor eee klassiga ega abzatslarni tanlaydi.
Lekin agar men shunday qilsam: p .eee, unda men
abzatslar ichida joylashgan eee klassiga ega barcha elementlarni tanlayman.
Bu farqni his eting.
Quyida keltirilgan koddagi selektor nimalarni tanlashini tushuntiring. Keyin ushbu selektorga mos keladigan HTML kodini yozing. Mana selektorli kod:
p.bbb {
color: red;
}
Quyida keltirilgan koddagi selektor nimalarni tanlashini tushuntiring. Keyin ushbu selektorga mos keladigan HTML kodini yozing. Mana selektorli kod:
p .bbb {
color: red;
}
Quyida keltirilgan koddagi selektor nimalarni tanlashini tushuntiring. Keyin ushbu selektorga mos keladigan HTML kodini yozing. Mana selektorli kod:
.eee p.bbb {
color: red;
}
Quyida keltirilgan koddagi selektor nimalarni tanlashini tushuntiring. Keyin ushbu selektorga mos keladigan HTML kodini yozing. Mana selektorli kod:
.eee p .bbb {
color: red;
}