Ce înseamnă termenul 'cascade' în CSS?

Cascade-ul în CSS determină care dintre stilurile în conflict trebuie aplicat unui element. Se bazează pe trei criterii principale:

1. Importanță: Stilurile cu !important au prioritatea cea mai mare.
2. Specificitate: Selecțiile mai specifice suprascriu pe cele mai puțin specifice. Specificitatea se calculează în funcție de numărul de ID-uri, clase/pseudo-clase/selectoare de atribut și etichete/pseudo-elemnte din selector.
3. Ordinea în codul sursă: În cazul în care importanța și specificitatea sunt egale, se aplică regula declarată ultima.

Pe lângă acești trei factori, se iau în considerare și alți factori:

• Sursa stilului: Stilurile utilizatorului (din setările browserului), stilurile autorului (stiluri externe și interne, stiluri inline), stilurile implicite ale browserului.
• Moștenirea: Unele proprietăți sunt moștenite de la elementele părinte către cele copil.

Exemplu de specificitate:

/* Specificitate: 0-1-0 */
.clasa-mea {
  culoare: albastru;
}

/* Specificitate: 1-0-0 */
#id-ul-meu {
  culoare: roșu;
}

În acest caz, elementul cu id-ul id-ul-meu și clasa clasa-mea va avea culoarea textului roșie, deoarece ID-ul #id-ul-meu are o specificitate mai mare decât .clasa-mea.