Mit jelent a 'kaskád' kifejezés a CSS-ben?

A CSS-ben a kaszkád határozza meg, hogy a konfliktusos stílusok közül melyik alkalmazandó egy elemre. Három fő kritérium alapján történik:

1. Fontosság: Az !important-tal jelölt stílusok a legmagasabb prioritással rendelkeznek.
2. Specifikusság: A specifikusabb szelektorok felülírják a kevésbé specifikusakat. A specifikusság a szelektorban lévő ID-k, osztályok/pseudo-osztályok/attribútumszelektorok és tagek/pseudo-elemek számán alapul.
3. A forráskód sorrendje: Ha azonos fontosság és specifikusság van, akkor az utoljára deklarált szabály érvényesül.

Ezeken kívül más tényezőket is figyelembe vesznek:

• Stílus forrása: A böngésző beállításaiból származó felhasználói stílusok, a szerző stílusai (külső és belső stíluslapok, inline stílusok), a böngésző alapértelmezett stílusai.
• Öröklődés: Néhány tulajdonság öröklődik a szülő elemekről a gyermekekre.

Példa specifikusságra:

/* Specifikusság: 0-1-0 */
.az-enem-osztalyom {
  szin: kék;
}

/* Specifikusság: 1-0-0 */
#az-enem-idom {
  szin: piros;
}

Ebben az esetben az az-enem-idom azonosítójú és az-enem-osztalyom osztályú elem piros színű szöveggel fog rendelkezni, mivel az ID #az-enem-idom magasabb specifikussággal bír, mint az osztály.