Prioritet for efterkommer-selektorer i CSS
I alle de foregående lektioner skulle alle selektorer fange selve elementet. Det kan forekomme, at en selektor fanger et element, og en anden selektor fanger forælderen til dette element.
Du ved allerede, at hvis en forælder får tildelt, for eksempel, en farve, så vil denne farve blive arvet af efterkommeren. Men hvis efterkommeren også får tildelt en farve, vil selektoren for efterkommeren have højere prioritet end selektoren for forælderen.
Det betyder, at en tag-selektor for en efterkommer slår en forælder-klasse:
<div class="block">
<p>text</p>
</div>
.block {
color: red;
}
p {
color: green; /* denne farve anvendes */
}
:
En tag-selektor for en efterkommer slår også et forælder- identifikator:
<div id="block">
<p class="text">text</p>
</div>
#block {
color: red;
}
.text {
color: green; /* denne farve anvendes */
}
:
