css优先级
优先级：
！import > 行内样式（1000）> Id（100）> 类、属性、伪类选择器（10）> 元素、伪元素（1）>通配符（0）>继承（0）
伪元素和伪类的区别
- 伪类本质上是为了弥补常规CSS选择器的不足，以便获取到更多信息；或是根据当前元素处于的状态，改变其样式。
它的功能和class有些类似，但它是基于文档之外的抽象，所以叫伪类。
-
伪元素本质上是创建了一个有内容的虚拟容器；或是对
元素中的特定内容进行操作（比如：设计伪元素的目的就是去选取诸如元素内容第一个字（母）、第一行，选取某些内容前面或后面这种普通的选择器无法完成的工作。）
它控制的内容实际上和元素是相同的，但是它本身只是基于元素的抽象，并不存在于文档中，所以叫伪元素。
根本区别：是否创建了“新”的元素
伪元素：
伪类：
:after/::after和:before/::before的异同
相同点
- 都可以用来表示伪元素，用来设置对象前的内容
- :before和::before写法是等效的; :after和::after写法是等效的
不同点
- :before/:after是Css2的写法，::before/::after是Css3的写法
- 所以css2的要比css3的兼容好 ：:before/:after 的兼容性要比::before/::after好 ，
- 不过在H5开发中建议使用::before/::after比较好
注意：
- 伪对象要配合content属性一起使用，类似于标签
- 伪对象不会出现在DOM中，所以不能通过js来操作，仅仅是在 CSS 渲染层加入
- 伪对象的特效通常要使用:hover伪类样式来**