总是分不太清楚，然后容易忘记这个概念，项目中又遇到了，复习一遍
问题
1.哪些常用的伪类？伪元素？
怎么记：
除了4个伪元素，其他都是伪类
哪四个伪元素？:before :after :first-letter :first-line
伪类
:first-child
:link
:visited
:hover
:active
等
2.伪类和伪元素的区别
想想常用:before :after 用来干嘛？
遇到的比较多的是在元素前后插入图片，或者清除浮动
h1:before
{
content:url(logo.gif);
}
<div class="div1">
<div class="left">Left</div>
<div class="right">Right</div>
<div class="clearfloat"></div>
</div>
.clearfix:after{
content:""; /*设置内容为空*/
height:0; /*高度为0*/
line-height:0; /*行高为0*/
display:block; /*将文本转为块级元素*/
visibility:hidden; /*将元素隐藏*/
clear:both; /*清除浮动*/
}
.clearfix{
zoom:1; /*为了兼容IE*/
}
定义：
伪元素是创造文档树之外的对象。例如文档不能提供访问元素内容第一字或者第一行的机制。伪元素还提供一些在源文档中不存在的内容分配样式，例如:before和:after能够访问产生的内容。
想想常用伪类用来干嘛？
匹配元素
a:link {color:#FF0000;} /* 未访问的链接 */
a:visited {color:#00FF00;} /* 已访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */
选择器匹配作为任何元素的第一个子元素的 <p> 元素
p:first-child
{
color:blue;
}
定义
伪类其实就是基于普通DOM元素而产生的不同状态，他是DOM元素的某一特征。
3.总结
一句话总结不同之处就是，伪元素产生新对象，在DOM树中看不到，但是可以操作；伪类不产生新的对象，仅是DOM中一个元素的不同状态；
css3中，为了区别和标准化，伪元素修改为以 :: 开头，但因为历史原因，浏览器对以:开头的伪元素也继续支持，但建议规范书写为::开头。