Priorita selektorov potomkov v CSS
Vo všetkých predchádzajúcich lekciách všetky selektory museli zachytiť samotný prvok. Môže nastať situácia, kedy jeden selektor zachytí prvok a druhý selektor zachytí rodiča tohto prvku.
Už viete, že ak je rodičovi nastavená, napríklad, farba, táto farba sa bude dediť na potomka. Ale, ak je potomkovi tiež nastavená farba, selektor potomka bude mať vyššiu prioritu ako selektor rodiča.
To znamená, že selektor tagu potomka poráža triedu rodiča:
<div class="block">
<p>text</p>
</div>
.block {
color: red;
}
p {
color: green; /* aplikuje sa táto farba */
}
:
Selektor tagu potomka tiež poráža identifikátor rodiča:
<div id="block">
<p class="text">text</p>
</div>
#block {
color: red;
}
.text {
color: green; /* aplikuje sa táto farba */
}
:
