伪类和伪元素的区别

伪类：向某些选择器中添加特殊的效果
伪元素：将一些特殊的效果添加到某些选择器

自己的个人理解伪类就是一些状态，比如:hover、:active、:link、:visited、:first-child、:focus
伪元素，顾名思义，就是伪造的元素，像:after、:before、:first-line、first-letter这些
（以上只是个人便于理解）

下面才是真的重头戏：
啥也不说，直接上代码吧：
关于伪类

p>i:first-child {color: red}

    first
    second

.first-child {color: red}

    first
    second

关于伪元素

p:first-letter {color: red}
I am stephen lee.

.first-letter {color: red}
I am stephen lee.

你会发现，伪类的实现可以通过添加一个类来达到目的，但是伪元素的话就是通过添加一个实际的元素才能达到目的，这样它们的命名是这样就无可厚非了

最后一点，就是CSS3为了区别上述两者，伪类使用的是：——一个冒号,而伪元素使用的是::——两个冒号