Приоритет селектора потомака у CSS-у

У свим претходним лекцијама сви селектори требало је да "ухвате" сам елемент. Може се десити да један селектор ухвати елемент, а други селектор ухвати родитеља тог елемента.

Већ знате да ако се родитељу зада, на пример, боја, тада ће се та боја наследити на потомка. Али, ако се и потомку такође зада боја, онда ће селектор потомка имати већи приоритет од селектора родитеља.

То значи да селектор тага потомка побеђује класу родитеља:

<div class="block">
	<p>text</p>
</div>

.block {
	color: red;
}
p {
	color: green; /* примениће се ова боја */
}

Селектор тага потомка такође побеђује идентификатор родитеља:

<div id="block">
	<p class="text">text</p>
</div>

#block {
	color: red;
}
.text {
	color: green; /* примениће се ова боја */
}