CSS继承、层叠、优先级

CSS继承:
<style>
p{font-size:12px;}
</style>
<p>CSS<span>继承</span></p>
p标签下的内容全都是12像素(继承)

继承好处:
1.父元素设置样式,子元素可以继承部分属性
2.减少CSS代码
注意:不是所有属性都可以继承

CSS层叠:
可以定义多个样式
不冲突时,多个样式可层叠为一个
冲突时,按不同样式规则优先级来应用样式

选择器权值
Id选择器>class选择器>标签选择器>通配符(全局选择器)
标签选择器:权值为1
类选择器和伪类:权值为10
ID选择器:权值为100
通配符选择器:权值为0
行内样式:权值为1000

权值规则
1.统计不同选择器的个数
2.每类选择器的个数乘以相应权值
3.把所有的值相加得出选择器的权值

权值举例:

!important规则
可调整样式规则的优先级(优先级升至最高)
添加在样式规则之后,中间用空格隔开
例如:div{color:red !important;}

CSS优先级:
1.css使用方法优先级:  
行内样式>内部样式>外部样式
2.css样式表中的优先级
同一样式表中:
(1)权值相同
    就近原则,离被设置元素越近优先级越高
(2)权值不同
    根据权值来判断CSS样式,哪种CSS样式权值高,就使用哪种样式

猜你喜欢

转载自blog.csdn.net/qq_39301366/article/details/82048709
今日推荐