伪元素~伪类

伪元素

定义：用于将特殊的效果添加到某些选择器

伪类表

属性	描述	CSS
:first-letter	向文本的第一个字母添加样式	1
:first-line	向文本首行添加样式	1
:before	在元素之前添加内容	2
:after	在元素之后添加内容	2

关于:before和::before的区别和伪元素的注意

1. 伪元素的由两个冒号::开头，然后是伪元素的名称
2. 使用两个冒号::是为了区别伪类和伪元素（CSS2中并没有区别）。当然，考虑到兼容性，CSS2中已存的伪元素仍然可以使用一个冒号:的语法，但是CSS3中新增的伪元素必须使用两个冒号::
3. 一个选择器只能使用一个伪元素，并且伪元素必须处于选择器语句的最后
4. :after还有一个妙用，那就是清除浮动，给父元素追加:after之后，设置content：" ";clear:both; 就可以清除浮动

伪类

定义: 用于向某些选择器添加特殊的效果

属性	描述	CSS
:active	向被激活的元素添加样式	1
:focus	向拥有键盘输入焦点的元素添加样式	2
:hover	当鼠标悬浮在元素上方时，向元素添加样式	1
:link	向未被访问的链接添加样式	1
:visited	向已被访问的链接添加样式	1
:first-child	向元素的第一个子元素添加样式	2
:lang	向带有指定 lang 属性的元素添加样式	2

区别总结

• 伪类与伪元素的根本区别在于它们是否创造了新的元素(抽象)
• 如果需要添加新元素加以标识的，就是伪元素，反之，如果只需要在既有元素上添加类别的，就是伪类
• 一个元素可以同时添加多个伪类，而每一次只能对一个伪元素进行操作
• 书写形式上的区别，单冒号是伪类，双冒号是伪元素（但这点不能作为绝对区分的点）