多重样式优先级深入概念

Posted james23

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了多重样式优先级深入概念相关的知识,希望对你有一定的参考价值。

什么是优先级

优先级是浏览器通过判断哪些属性值与元素最相关以决定并应用到该元素上的。优先级仅由选择器组成的匹配规则决定的。

优先级就是分配给指定的CSS声明的一个权重,它由匹配的选择器中的每一种选择器类型的数值决定。

优先级顺序

下列是一份优先级逐级增加的选择器列表:

  • 通用选择器(*)
  • 元素(类型)选择器
  • 类选择器
  • 属性选择器
  • 伪类
  • ID 选择器
  • 内联样式

!important 规则例外

当 !important 规则被应用在一个样式声明中时,该样式声明会覆盖CSS中任何其他的声明, 无论它处在声明列表中的哪里. 尽管如此, !important规则还是与优先级毫无关系.使用 !important 不是一个好习惯,因为它改变了你样式表本来的级联规则,从而使其难以调试。

一些经验法则:

  • Always 要优化考虑使用样式规则的优先级来解决问题而不是 !important
  • Only 只在需要覆盖全站或外部 css的特定页面中使用 !important
  • Never 永远不要在全站范围的 css 上使用 !important
  • Never 永远不要在你的插件中使用 !important

以上是关于多重样式优先级深入概念的主要内容,如果未能解决你的问题,请参考以下文章

Web前端开发笔记——第三章 CSS语言 第一节 CSS的基本概念和样式表

关于CSS的个人理解

详细解读CSS优先级——Web前端系列学习笔记

详细解读CSS优先级——Web前端系列学习笔记

实体框架代码优先自加入,'多重性在角色中无效'

面向对象之多重继承