定义

　
CSS伪类 用于向某些选择器添加特殊的效果。
CSS伪元素 用于将特殊的效果添加到某些选择器。

这TM不一样吗？？？

CSS中的类选择器（class）是为了方便过滤（选择）元素，给这类元素添加样式，class是定义在HTML文档树中的。但是这在一些情况下是不够用的，比如用户的交互动作（悬停hover、激活active等）会导致元素状态发生变化，class对这些动态变化无能为力。为此，CSS引入了伪类（pseudo-class）的概念用来支持根据文档树以外的信息来过滤元素的能力。

伪类是一个抽象类，本质上还是一个类，因此其主要作用仍然是用来选择元素而后设定具体的样式。伪类的选择对象可能会随着用户操作文档而发生变化，比如当用户删除某些节点后，会影响子元素（nth-child）伪类的选择。伪类选择元素的依据不是名称、属性或内容，而是根据特征（比如状态或顺序）。（:lang除外）

伪元素（pseudo-element）是另外一个概念，其设计意图和伪类一样，是为了能支持根据文档树以外的信息来进行格式化。伪元素本质上是一个元素，只是它一般需要依附在一个已有元素上，作为这个元素的“部分”或“补充”。比如::first-line或::after。CSS2.1规范中引入的新的伪元素语法是双冒号::，但为了和历史版本兼容，一些之前引入的伪元素仍然可以使用单冒号语法。

共同点

　
1.两者都不存在于HTML文档树中，都是为了支持依靠文档树之外的信息来进行格式化。
2.出于历史兼容性原因，一些在CSS2.1规范之前引入的伪元素使用和伪类一样的语法标记（单冒号:）。
3.伪类本质上和类相同，是用来选择过滤HTML元素的。只不过伪类是按动态特征过滤，而不是名称、属性或内容。
4.伪元素本质上和元素相同，是已有元素的某个部分或新创建的补充元素。伪元素上可以应用伪类选择器来过滤。

区别

　
伪类的效果可以通过添加一个实际的类来达到，而伪元素的效果则需要通过添加一个实际的元素才能达到，也就是说，伪元素用来过滤内容或创建补充内容，需要在这些内容外包装一个虚拟的容器，然后应用特定的样式——这也是为什么他们一个称为伪类，一个称为伪元素的原因。这就是两者的根本区别：是否创造了新的元素。如果需要添加新元素加以标识的，就是伪元素，反之，如果只需要在既有元素上添加类别的，就是伪类。
另外，伪类可以出现在选择器的任何地方，而伪元素只能添加在最后一个简单选择器之后。我们可以在伪元素上应用伪类。

实例

　
CSS伪类：（IE必须声明doctype，IE6支持a标签的部分）

:first-child IE8F2C4O9.6S3.1
:link IE7F2C4O9.6S3.1
:visited IE7F2C4O9.6S3.1
:hover IE7F2C4O9.6S3.1
:active IE7F2C4O9.6S3.1
:focus IE8F2C4O9.6S3.1
:lang IE8F2C4O9.6S3.1


CSS3增加的：IE9F3.5C4O9.6S3.2

:target
:enabled
:disabled
:checked
:indeterminate
:root
:nth-child()
:nth-last-child()
:nth-of-type()
:nth-last-of-type()
:last-child
:first-of-type
:last-of-type
:only-child
:only-of-type
:empty
:not()


以下需要IE10F4C10O10S5

:valid
:invalid
:required
:optional


以下不被IE支持：F(-moz-)COS

:read-only
:read-write
:in-range
:out-of-range


CSS伪元素：

:first-line IE9F1C1O7S1
:first-letter IE9F1C1O7S1
:before IE9F3.5C4O7S3.1
:after IE9F3.5C4O7S3.1


兼容的单冒号伪元素：

:first-line IE5.5F1C1O5.5S1
:first-letter IE5.5F1C1O5.5S1
:before IE8F3.5C4O4S3.1（IE8必须声明doctype）
:after IE8F3.5C4O4S3.1（IE8必须声明doctype）


扩展阅读：
w3c在css2.1中对伪类和伪元素的描述
w3c在css2.2中对伪类和伪元素的描述
w3c在css3中对伪元素的描述
w3c在css3中对伪类的描述