Защо селекторите в CSS се наследяват прекалено много?

Селектори в CSS не се наследяват. Наследяването в CSS се отнася до предаването на някои свойства на елемент към неговите потомци. Селекторите са шаблони, които избират елементи за прилагане на стилове.

Наследяването може да означава, че стиловете, приложени чрез един селектор, могат да бъдат отменени (наследени) от стилове, приложени чрез друг селектор. Това не е свързано с наследяването, а с механизма на каскадата на CSS, който определя кои стилове се прилагат към елемент, когато няколко правила CSS задават стойност за една и съща свойства.

Фактори, влияещи на каскадата и "отменянето" на стилове:

1. Специфичност (Specificity): Селектори с по-висока специфичност имат по-голям тежест.
2. Ред (Order): При еднаква специфичност, се прилага правилото, което е декларирано последно.
3. Важност (!important): Декларациите, маркирани с !important, имат най-висок приоритет (освен вградени стилове на User Agent с !important).
4. Източници на стилове (Origin): Стиловете идват от различни източници (браузър, потребител, автор).

Пример за специфичност:

/* Ниска специфичност */
p {
  color: blue;
}

/* Висока специфичност - ще презапише цвета */
.text-section p {
  color: red;
}