CSS的优先级
（从上至下优先级依次降低）
- 在属性后面使用！important会覆盖页面内任何位置定义的元素样式
#text{
color: red !important;
}
- 作为style属性写在元素标签上的内联样式
<div class="wrap" style="color:red"
hello
</div>
- id选择器
- 类选择器
- 伪类选择器
- 属性选择器
- 标签选择器、伪元素选择器
- 通配符（#）选择器
- 浏览器自定义
复杂场景下CSS的优先级
首先对CSS优先级别做一个分类：
| 标号 | a | b | c | d |
|---|---|---|---|---|
| 选择器 | 内联样式 | id选择器 | 类选择器、伪类选择器、属性选择器 | 标签选择器、伪元素选择器 |
看以下例子：
#test p.class1{
color: red;
}
/*a=0;b=1;c=1;d=1*/
#test .class1.class2{
color: blue;
}
/*a=0;b=1;c=1;d=0*/
/*字体为红色*/
