CSS基础
Cascading Style Sheet
层叠样式表
选择器{
属性:值;
属性:值
}
分号是分隔符
选择器：
1. 用于匹配HTML元素
有不同的匹配规则，多个选择器可叠加
2. 分类和权重
选择器分类
元素选择器a{}
伪元素选择器::before{}
类选择器.link{}
属性选择器 [type=radio]{}
伪类选择器:hover{}
ID选择器 #id{}
组合选择器 [type=checkbox] + label{}
否定选择器 :not(.link){}
通用选择器*{}
选择器权重
ID选择器#id{} +100j
类 属性 伪类 +10
元素 伪元素 +1
其它选择器 +0
计算一个不进位的数字
#id .link a[href]
100+10+1+0 = 111
#id .link.active
100+10+10 = 120
如果一个id选择器，11个类选择器 第一位是1， 第二位是11，不进位
!important优先级最高
style元素属性 优先级高比id高
相同权重 后写的生效
3.性能
<style>
.body div .hello{
color: red;
}
</style>
<body class="body" id="body">
Hello CSS!
<div>
<a class="hello">aaa</a>
</div>
</body>
浏览器是从右往左进行解析。.hello先找，再看div 和.body
.hello精确范围小，这样找性能高。
来源：CSDN
作者：.01
链接：https://blog.csdn.net/qq_43340342/article/details/104378044