css伪类和伪元素的不同

css3给出的伪类定义：

伪类是用来允许选择器去选择一些存在于dom之外的信息或者一些不能够通过现在的选择器进行定位信息。也就是说伪类其实是为了弥补选择器的不足，例如：

1. :hover， 当鼠标悬停在一个元素上时，可以用这个伪类来为此状态下的元素添加样式。很明显，鼠标悬停在一个元素上的这些信息，并不存在与dom树中。
2. :first-child , 要获取第一个子元素，无法通过常规选择器直接获取，这时候就可以使用伪类:first-child

li:first-child {
        color: #ee5588;
    }

<ul>
       <li>1111</li>
       <li>22222</li>
       <li>33333</li>
   </ul>

css3给出的伪元素定义：

大概意思为：伪元素可以创建一些dom无法创建的元素。比如，dom并没有一种机制可以访问一个元素的第一行或者第一个字母，但是伪元素可以做到。并且伪元素还可以创建不存在于源文档中的元素 比如::after和::before

还有一个不同是，一般情况下伪类用单冒号表示:hover, 伪元素则用双冒号表示::after, 但是在IE8中，浏览器只支持单引号，这也就是为什么利用伪元素after清除浮动的时候都是:after这种写法。