De ce sunt selectorii în CSS moșteniți excesiv?

Selecțorii în CSS nu sunt moșteniți. Moștenirea în CSS se referă la transmiterea anumitor proprietăți ale unui element către descendenții săi. Selecțorii sunt modele care aleg elementele pentru aplicarea stilurilor.

Moștenirea poate însemna că stilurile aplicate printr-un selector pot fi suprascrise (moștenite) de stiluri aplicate prin alt selector. Acest lucru nu are legătură cu moștenirea, ci cu mecanismul de cascade al CSS, care determină ce stiluri se aplică unui element atunci când mai multe reguli CSS stabilesc o valoare pentru aceeași proprietate.

Factorii care influențează cascadea și "suprascrierea" stilurilor:

1. Specificitatea (Specificity): Selecțorii cu o specificitate mai mare au o pondere mai mare.
2. Ordinea (Order): În cazul unei specificități egale, se aplică regula declarată ultima.
3. Importanța (!important): Declarațiile marcate cu !important au prioritate maximă (cu excepția stilurilor încorporate ale User Agent-ului cu !important).
4. Sursa stilurilor (Origin): Stilurile provin din surse diferite (browser, utilizator, autor).

Exemplu de specificitate:

/* Specificitate scăzută */
p {
  color: blue;
}

/* Specificitate ridicată - va suprascrie culoarea */
.text-section p {
  color: red;
}