CSS каскадирование с примерами
Кто-нибудь может привести пример, описывающий каскадирование в CSS и когда они полезны? Я видел ответы, описывающие каскадирование, а также разницу между каскадированием и наследованием, но я не видел ответа, описывающего CSS Cascading на примере.
2 ответа
Когда вы рассматриваете только таблицы стилей "автор" (не пользователь или пользовательский агент), то вы, вероятно, смущены не столько "каскадом", сколько правилами "специфичности" для CSS.
Вот несколько хороших объяснений того, как работает специфичность и как выяснить, почему определенные правила применяются к вашим элементам:
http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
http://css-tricks.com/specifics-on-css-specificity/
РЕДАКТИРОВАТЬ: Каскад: Все применимые правила для элемента собраны, а затем упорядочены в соответствии с их происхождением (большее число означает более высокий приоритет):
- объявления агента пользователя
- пользовательские обычные объявления
- автор нормальных объявлений
- автор важных деклараций
- важные пользовательские объявления
Специфика используется в качестве тай-брейка, если происхождение одинаково. Наконец, если специфичность одинакова, то порядок декларации является окончательным нарушителем. Надеюсь, это понятно без утомительного примера...
Каскад: см. Слайды на http://www.maxdesign.com.au/articles/css-cascade/%5D%28http://www.maxdesign.com.au/articles/css-cascade/ для хорошего объяснения
По наследству против каскада:
"Наследование - это механизм, который отделен от каскада: наследование применяется к дереву DOM (Document Object Model), тогда как каскад имеет дело с правилами таблицы стилей. Однако свойства CSS, установленные для элемента через каскад, могут наследоваться этим элементом. дочерние элементы. " - http://reference.sitepoint.com/css/inheritance