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