CSS-da avlod selektorlarining ustunligi
Oldingi barcha darslarda barcha selektorlar elementning o'zini ushlashi kerak edi. Bunday bo'lishi mumkinki, bir selektor elementni ushlaydi, ikkinchisi esa ushbu elementning ota-onasini ushlaydi.
Siz allaqachon bilasizki, agar ota-onga, masalan, rang belgilangan bo'lsa, bu rang avlod tomonidan meros qolinadi. Ammo, agar avlodga ham rang belgilangan bo'lsa, unda selektor avlod ota-ona selektoriga qaraganda katta ustunlikka ega bo'ladi.
Bu shuni anglatadiki, avlod tegi selektori g'alaba qozonadi ota-ona sinfini:
<div class="block">
<p>text</p>
</div>
.block {
color: red;
}
p {
color: green; /* shu rang qo'llaniladi */
}
:
Avlod tegi selektori ham g'alaba qozonadi identifikatorni ota-ona:
<div id="block">
<p class="text">text</p>
</div>
#block {
color: red;
}
.text {
color: green; /* shu rang qo'llaniladi */
}
:
