Prioritatea selectorilor descendenți în CSS
În toate lecțiile anterioare, toți selectorii trebuiau să selecteze elementul însuși. Este posibil ca un selector să selecteze un element, iar un al doilea selector să selecteze părintele acelui element.
După cum știți deja, dacă unui părinte i se atribuie, de exemplu, o culoare, această culoare va fi moștenită de descendent. Cu toate acestea, dacă și descendentului i se atribuie o culoare, atunci selectorul descendentului va avea o prioritate mai mare decât selectorul părintelui.
Aceasta înseamnă că selectorul de tip al descendentului învinge clasa părintelui:
<div class="block">
<p>text</p>
</div>
.block {
color: red;
}
p {
color: green; /* se va aplica această culoare */
}
:
Selectorul de tip al descendentului învinge, de asemenea, identificatorul părintelui:
<div id="block">
<p class="text">text</p>
</div>
#block {
color: red;
}
.text {
color: green; /* se va aplica această culoare */
}
: