!Css的优先级

每天一记:

首先:        !import的样式优先级高于一切

 

Body中 优先级:
1.最近的祖先样式比其他祖先样式优先级高。
2.内联样式"比"祖先样式"优先级高





选择器的优先级
上面讨论了一个标签从祖先继承来的属性,现在讨论标签自有的属性。在讨论 CSS 优先级之前,先说说 CSS 7 种基础的选择器:

  • ID 选择器, 如 #id{}

  • 类选择器, 如 .class{}

  • 属性选择器, 如 a[href="segmentfault.com"]{}

  • 伪类选择器, 如 :hover{}

  • 伪元素选择器, 如 ::before{}

  • 标签选择器, 如 span{}

  • 通配选择器, 如 *{}

优先级关系:内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器


计算选择符中 ID 选择器的个数(a),计算选择符中类选择器、属性选择器以及伪类选择器的个数之和(b),计算选择符中标签选择器和伪元素选择器的个数之和(c)。按 a、b、c 的顺序依次比较大小,大的则优先级高,相等则比较下一个。若最后两个的选择符中 a、b、c 都相等,则按照"就近原则"来判断。


属性后插有 !important 的属性拥有最高优先级。若同时插有 !important,则再利用规则 3、4 判断优先级。








本文来自博客园,作者:咸瑜,转载请注明原文链接:https://www.cnblogs.com/bi-hu/p/14826454.html

原文地址:https://www.cnblogs.com/bi-hu/p/14826454.html