CSS Rövid tanfolyam
A kaszkád az, ami a CSS stíluslapokat olyan hasznosnak tekinti. Röviden, a kaszkád határozza meg az egymásnak ellentmondó stílusok alkalmazásának elsőbbségi sorrendjét. Más szóval, ha két stílusa van:
p {szín: piros; }
p {szín: kék; }
A kaszkád határozza meg, hogy melyik szín legyen a bekezdéseknek, annak ellenére, hogy a stíluslap azt állítja, hogy piros és kéknek kell lenniük. Végső soron csak egy színre lehet alkalmazni a bekezdéseket, ezért rendelésre kell lennie.
Ezt a sorrendet alkalmazza, hogy melyik szelektort (a fenti példában a p) a legmagasabb elsőbbséggel és milyen sorrendben jelenik meg a dokumentumban.
Az alábbi lista egyszerűsíti, hogy a böngésző hogyan határozza meg a stílus elsőbbségét:
- Nézze meg a stíluslapot az elemnek megfelelő szelektorhoz. Ha nincsenek definiált stílusok, akkor használja az alapértelmezett szabályokat a böngészőben
- Nézd meg a jelöltekhez tartozó stíluslapot! Fontos és alkalmazd azokat a megfelelő elemekre.
- A stíluslap valamennyi stílusa felülbírálja az alapértelmezett böngészőstílusokat (kivéve a felhasználói stíluslapok esetében).
- Minél specifikusabb a stílusválasztó, annál nagyobb a prioritása. Például, a div> p.class specifikusabb, mint a p.class, amely specifikusabb, mint p.
- Végül, ha két szabály vonatkozik ugyanarra az elemre, és ugyanaz a választó elsőbbsége van, akkor az utolsó betöltésre kerül. Más szavakkal, a stíluslapot felülről lefelé olvassuk le, és a stílusokat egymás tetejére helyezzük.
E szabályok alapján a fenti példában a bekezdéseket kékre kell írni, mert p {color: blue; } az utolsó a stíluslapon.
Ez a kaszkád nagyon egyszerűsített magyarázata. Ha jobban szeretne többet tudni arról, hogy a kaszkád hogyan működik, akkor olvassa el: Mit jelent a "Cascade" a Cascading stíluslapokban? .