样式表允许以多种方式规定样式信息。可以规定在单个的 HTML 元素中、在 HTML 页的头元素中、或在一个外部的 CSS 文件中、甚至可以在同一个 HTML 文档内部引用多个外部样式表。如果外部样式放在内部样式的后面，则外部样式将覆盖内部样式。
一般情况下，优先级如下：
（内联样式）Inline style > （内部样式）Internal style sheet >（外部样式）External style sheet > 浏览器默认样式
优先级是浏览器通过判断哪些属性值与元素最相关以决定并应用到该元素上的。优先级仅由选择器组成的匹配规则决定的。
优先级就是分配给指定的CSS声明的一个权重，它由匹配的选择器中的每一种选择器类型的数值决定。
优先级顺序
下列是一份优先级逐级增加的选择器列表：
通用选择器（*）
元素(类型)选择器
类选择器
属性选择器
伪类
ID 选择器
内联样式
!important 规则例外
!important 规则被应用在一个样式声明中时,该样式声明会覆盖CSS中任何其他的声明, 无论它处在声明列表中的哪里. !important规则还是与优先级毫无关系.使用 !important 不是一个好习惯，因为它改变了你样式表本来的级联规则，从而使其难以调试。
一些经验法则：
Always 要优化考虑使用样式规则的优先级来解决问题而不是 !important
Only 只在需要覆盖全站或外部 css（例如引用的 ExtJs 或者 YUI ）的特定页面中使用 !important
Never 永远不要在全站范围的 css 上使用 !important
Never 永远不要在你的插件中使用 !important
权重计算:
继承0,0,0,0 (* 通配符) < 标签选择器 0,0,0,1< 类选择器 0,0,1,0 < id选择器0,1,0,0 < 行内样式 1,0,0,0 < !important |
|
收藏
淘帖
踩
