是否存在一致/通用的顺序,浏览器将CSS样式应用于DOM元素?
例如,框模型是:边距,边框,填充和宽度。
浏览器是否处理以与框模型相同的顺序列出的CSS样式比列出的CSS样式更快:宽度,填充,边框和边距?
并且,是否有处理所有CSS样式的顺序的标准/规则?
编辑: 我问的是浏览器应用特定CSS样式的具体顺序。这是一个通用标准还是每个浏览器?例如,浏览器在应用背景颜色之前是否必须应用z-index?
答案 0 :(得分:4)
CSS样式将始终从上到下应用,从外部样式表开始(按照它们链接的顺序),然后是文档头部的样式,然后是内联样式。层次结构中稍后的样式将覆盖先前出现的样式。
编辑:我需要修改我的答案。特异性也起着重要作用。 CSS选择器的定义越明确,它的优先级就越高。具有相同特异性的选择器按照我最初的说法工作。[http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/]
编辑#2:实际上有一种很好的方法来计算给定的一组选择器具有的特异性,可以在这里找到:[http://www.htmldog.com/guides/cssadvanced/specificity/]
(id选择器)#foo
值100白
(类选择器).bar
值10
(html选择器)html/body/p/span/div/etc
值得1
#foo span.bar
= 111
html body p span
= 4
等