Приоритет на селекторите на потомци во 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; /* ќе се примени оваа боја */
}