Каскадата е това, което прави CSS стиловите листове толкова полезни. Накратко, каскадата определя реда на приоритет за това как трябва да се прилагат противоречиви стилове. С други думи, ако имате два стила:
p {цвят: червен; }p {цвят: син; }
Каскадата определя кои цветове трябва да бъдат параграфите, въпреки че стиловата таблица посочва, че те трябва да са червени и сини. В крайна сметка само един цвят може да се приложи към параграфите, така че трябва да има ред. И тази поръчка се прилага от кои селектори ( р
в горния пример) са с най-висок приоритет и в какъв ред те се появяват в документа.
Следващият списък е опростяване на това, как браузърът ви дава предимство за даден стил:
- Погледнете в стиловия лист за селектор, съответстващ на елемента. Ако няма дефинирани стилове, използвайте стандартните правила в браузъра
- Погледнете в стиловия лист за отбелязаните селектори
! важно
и да приложи тези към съответните елементи. - Всички стилове в стиловия лист ще заменят стандартните стилове на браузъра (с изключение на стиловите листове на потребителите).
- Колкото по-специфичен е селекторът на стилове, толкова по-голям е неговият приоритет. Например,
div> p.class
е по - конкретен отp.class
който е по - конкретен отр
. - И накрая, ако две правила се отнасят за един и същи елемент и имат един и същ приоритет, този, който е бил зареден последно ще бъдат приложени. С други думи, листа стил се чете от горе до долу и стиловете се прилагат едно върху друго.
Въз основа на тези правила в горния пример параграфите ще бъдат написани в синьо, защото p {цвят: син; }
е последен в листа стил.
Това е много опростено обяснение на каскадата. Ако се интересувате да научите повече за това как каскадата работи, трябва да прочетете Какво означава "Cascade" означава в Cascading Style Sheets ?.