Miért öröklődnek túl a CSS-szelektorok?

A CSS-ben a szelektorok nem öröklődnek. Az öröklődés a CSS-ben arra utal, hogy egy elem bizonyos tulajdonságait átadja az utódainak. A szelektorok minták, amelyek kiválasztják az elemeket a stílusok alkalmazásához.

Az öröklődés azt jelentheti, hogy egy szelektorral alkalmazott stílusokat más szelektorral alkalmazott stílusok felülírhatják (öröklődhetnek). Ez nem az öröklődéshez kapcsolódik, hanem a CSS kaszkád mechanizmusához, amely meghatározza, hogy több CSS szabály esetén melyik stílus alkalmazódik egy elemre, amikor ugyanazt a tulajdonságot állítják be.

A kaszkád és a "felülírás" befolyásoló tényezői:

1. Személyesség (Specificity): Magasabb személyességgel rendelkező szelektorok nagyobb súlyt kapnak.
2. Sorrend (Order): Azonos személyesség esetén az utolsóként deklarált szabály érvényesül.
3. Fontosság (!important): Az !important-tal jelölt deklarációk a legmagasabb prioritással bírnak (kivéve a beágyazott stílusokat a User Agent-től, !important-tal).
4. Stílusforrások (Origin): A stílusok különböző forrásokból származnak (böngésző, felhasználó, szerző).

Példa a személyességre:

/* Alacsony személyesség */
p {
  color: blue;
}

/* Magas személyesség - felülírja a színt */
.text-section p {
  color: red;
}