一、伪类与伪元素
为什么css要引入伪元素和伪类：是为了格式化文档树以外的信息，也就是说，伪类和伪元素是用来修饰不在文档树中的部分
伪类用于当已有元素处于的某个状态时，为其添加对应的样式，这个状态是根据用户行为而动态变化的。比如：hover，虽然它和普通的css类相似，可以为已有的元素添加样式，但是它只有处于dom树无法描述的状态下才能为元素添加样式，所以将其称为伪类。
伪元素用于创建一些不在文档树中的元素，并为其添加样式，比如:before在一个元素前添加一些文本，并为这些文本添加样式，虽然用户可以看到这些文本，但是这些文本实际上不在文档树中。
举个例子：
<ul>
<li></li>
<li></li>
<li></li>
</ul>
如果想改变第一li的样式，一般会在li标签上设置一个class类，这时可以换一种写法，用伪类实现
li:first-child{
}
另外一个伪元素的例子：
<p>hello world，and best wishes for you</p>
如果我们想实现改变上面文本中第一个字母的样式，我们可以使用<span class="first">h</span>来进行修改，还可以用伪元素的方法实现
p:first-letter{
}
比较上面两个例子可以得出：伪类操作的对象是文档树中已有的元素，而伪元素是创建一个文档树外的元素