Izvedite, kaj Cascade v Cascading Style Sheets pomeni

Kratki tečaj CSS

Kaskada je tisto, kar naredi CSS slogovne liste tako koristne. Skratka, kaskada definira vrstni red prednost, kako naj se uporabijo nasprotujoči si slogi. Z drugimi besedami, če imate dva načina:

p {barva: rdeča; }
p {barva: modra; }

Kaskada določa barvo, v kateri naj bodo odstavki, čeprav v slogovnem listu navajajo, da morajo biti rdeče in modre. Na koncu se lahko uporabi samo ena barva za odstavke, zato mora biti naročilo.

In to naročilo se uporablja, pri čemer imajo izbirniki (p v zgornjem primeru) najvišjo prednost in vrstni red, ki se pojavijo v dokumentu.

Naslednji seznam je poenostavitev, kako vaš brskalnik odloča za prednost sloga:

  1. Poglejte slogovni list izbirnika, ki ustreza elementu. Če ni določenih stilov, uporabite privzeta pravila v brskalniku
  2. Oglejte si slogovni list za označene selektorje! Pomembno in jih uporabite za ustrezne elemente.
  3. Vsi slogi v slogovnem listu bodo preglasili privzete sloge brskalnikov (razen v primeru slogov uporabniških slogov).
  4. Bolj specifičen je izbirnik sloga, tem večje bo prednost. Na primer, div> p.class je bolj specifičen kot p.class, ki je bolj specifičen kot p.
  5. Končno, če sta za isti element veljata dva pravila in imajo enako prednost pred selektorjem, se bo uporabil zadnji, ki je bil nazadnje naložen. Z drugimi besedami, slogovni ploat se bere od vrha do dna, slogi pa se nanesejo drug na drugega.

Na podlagi teh pravil bi bili v zgornjem primeru odstavki napisani modro, ker p {color: blue; } je nazadnje v slogovnem listu.

To je zelo poenostavljena razlaga kaskade. Če vas zanima več o tem, kako deluje kaskada, morate prebrati, kaj pomeni "Cascade" v Cascading Style Sheets? .