伪类和伪元素的区别

w3c 对二者的定义：
• CSS 伪类用于向某些选择器添加特殊的效果。
• CSS 伪元素用于将特殊的效果添加到某些选择器。
小七想说是否是一脸懵逼？好我小七来个定义伪就是“假”的意思，伪类就是建立了一个假的类名；伪元素就是建立了一个假的元素标签。什么？尚未理解那来动真格的，举例：你想给ul里面的第一个li改变背景
<ul>
<li>1</li>
<li>2</li>
</ul>
通常方法就是给第一个li加一个类名而后css样式 .first{background:red}就搞定了
<ul>
<li class=”first”>1</li>
<li>2</li>
</ul>
那么使用伪类的方法li:first-child{background:red}能够达到一样的效果，因此说伪类就是至关于建立了一个假的类名，而实际他没建立就能够达到效果，是否是很爽啊！
一样举例说明伪元素（就是建立了假的元素）：如让<p>啊啦啦啦</p>里面的啊变颜色咱们的通常作法是<p><span>啊</span>啦啦啦</p>而后span{color:red}
可是用伪元素就不用建立新元素span了,直接p::first-letter{color:red}就能够搞定了是否是很爽啊，至关于建立了一个假的元素span然而实际并无建立
由上总结：伪类和伪元素的区别就是一个是效果相似与建立类名一个是效果相似与建立元素标签
CSS3规范中的要求使用双冒号(::)表示伪元素，以此来区分伪元素和伪类，大概的意思就是：虽然CSS3标准要求伪元素使用双冒号的写法，但也依然支持单冒号的写法。为了向后兼容，咱们建议你在目前仍是使用单冒号的写法。

图片出处：http://web.jobbole.com/86181/