45

问答题 45 /501

请你说说CSS有什么特殊性?(优先级、计算特殊值)

参考答案

优先级

(1)、同类型,同级别的样式后者先于前者
(2))、ID > 类样式 > 标签 > *
(3)、内联>ID选择器>伪类>属性选择器>类选择器>标签选择器>通用选择器(*)>继承的样式
 
(4)、具体 > 泛化的,特殊性即css优先级
(5)、近的 > 远的 (内嵌样式 > 内部样式表 > 外联样式表)
  内嵌样式:内嵌在元素中,<span style="color:red">span</span>
  内部样式表:在页面中的样式,写在<style></style>中的样式
      外联样式表:单独存在一个css文件中,通过link引入或import导入的样式
(6)、!important 权重最高,比 inline style 还要高

计算特殊性值

important > 内嵌 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符
权重、特殊性计算法:
CSS样式选择器分为4个等级,a、b、c、d
(1)、如果样式是行内样式(通过Style=“”定义),那么a=1,1,0,0,0 
(2)、b为ID选择器的总数 0,1,0,0 
(3)、c为属性选择器,伪类选择器和class类选择器的数量。0,0,1,0
(4)、d为标签、伪元素选择器的数量 0,0,0,1
(5)、!important 权重最高,比 inline style 还要高
比如结果为:1093比1100,按位比较,从左到右,只要一位高于则立即胜出,否则继续比较。