Oldingi barcha darslarda selektorlar elementning o'zini olishi kerak edi. Shunday bo'lishi mumkinki, bitta selektor elementni, ikkinchi selektor esa ushbu elementning ota tanlashi kerak.
Siz allaqachon bilasizki, agar ota elementga, rang berilsa, unda bu rang avlod elementga meros bo'lib qoladi. Ammo, agar rang avlod elementga ham berilgan bo'lsa, unda avlod element selektori ota element selektoriga qaraganda ustunroq bo'ladi.
Bu shuni anglatadiki, o'sha bolaning tanlovchisi ota clasidandan ustun chiqadi.
.block {
color: red;
}
p {
color: green; /* применится этот цвет */
}
<div class="block">
<p>text</p>
</div>
<div id="block">
<p class="text">text</p>
</div>
<div>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<p>
+++
</p>
</div>
<p>
---
</p>
<p>
---
</p>