Dlaczego selektory w CSS są nadmiernie dziedziczone?

Selektory w CSS nie są dziedziczone. Dziedziczenie w CSS odnosi się do przekazywania niektórych właściwości elementu do jego potomków. Selektory to wzorce, które wybierają elementy do zastosowania stylów.

Dziedziczenie może oznaczać, że style zastosowane za pomocą jednego selektora mogą zostać nadpisane (dziedziczone) przez style zastosowane za pomocą innego selektora. Nie jest to związane z dziedziczeniem, lecz z mechanizmem kaskadowości CSS, który określa, które style są stosowane do elementu, gdy kilka reguł CSS ustawia wartość dla tej samej właściwości.

Czynniki wpływające na kaskadowość i "nadpisywanie" stylów:

1. Specyficzność (Specificity): Selektory o wyższej specyficzności mają większą wagę.
2. Kolejność (Order): Przy takiej samej specyficzności, stosuje się regułę ostatnią deklarowaną.
3. Ważność (!important): Deklaracje oznaczone !important mają najwyższy priorytet (z wyjątkiem stylów wbudowanych User Agent z !important).
4. Źródła stylów (Origin): Style pochodzą z różnych źródeł (przeglądarka, użytkownik, autor).

Przykład specyficzności:

/* Niska specyficzność */
p {
  color: blue;
}

/* Wysoka specyficzność - nadpisze kolor */
.text-section p {
  color: red;
}