CSS选择器
作者:互联网
一、CSS基础属性
举列:h1{ color:red; text-align: center; } 选择器:h1 声明块:{color:red; text-align: center;}
二、CSS选择器
CSS选择器,决定了将规则应用到哪些元素上
三种基本选择器:元素选择器、类选择器、ID选择器
除此之外,CSS还提供了大量的选择器
三、声明冲突
四、层叠概述
什么是层叠:层叠是一种机制,用于解决CSS声明冲突
多个相同的CSS声明(属性),应用到同一个元素上
五、层叠过程:
比较优先级:每一个声明都有一个优先级
当发生冲突时,优先级高的会保留,优先级低的会被淘汰
一个声明的优先级,与它的来源和重要性有关
1.浏览器默认样式表中的声明
2.用户样式表中的普通声明
3.作者样式表中的普通声明
4.作者样式表中的重要声明
5.用户样式表中的重要声明
优先级由低到高排序
比较特殊性:每一个声明都有一个特殊性(Specificity)
当发生冲突时,特殊性高的会保留,特殊性低的会被淘汰
一个声明的特殊性,取决于规则适用范围的大小
规则适用范围越大,特殊性越低,适用范围越小,特殊性越高
具体规则:
示列:
每一个声明都有一个特殊性(Specificity)
当发生冲突时,特殊性高的会保留,特殊性低的会被淘汰
一个声明的特殊性,取决于规则适用范围的大小
规则适用范围越大,特殊性越低,适用范围越小,特殊性越高
比较源次序:
最后出现的声明胜出,其他的全部淘汰
该规则的实际应用:
CSS Reset代码前置
a元素的伪类书写顺序
六、继承
继承:继承(inherit),指子元素会自动拥有父元素的某些CSS属性
CSS代码:body{color:red}
HTML代码:
<body> body中的内容 <p>p元素中的内容</p> </body>
p元素自动拥有了父元素body的color属性
示列:
继承发生的场景:
该属性是可继承的属性,该属性在样式表中没有声明
标签:优先级,特殊性,样式表,声明,选择器,CSS 来源: https://www.cnblogs.com/jrzqdlgdx/p/10948956.html