伪类和伪元素的区别

伪类和伪元素的区别？？？？？？

伪元素和伪类的区别：
（1）伪类和伪元素的最大区别就在于有没有创建一个文档树以外的元素。伪元素创建了一个文档树以外的元素（虚拟容器）并为他添加样式，这个容器不包含任何DOM元素但是可以包含内容。换句话说伪类和伪元素的区别就是伪类的操作对象是文档树中已有的元素，而伪元素则创建了一个文档树以外的元素。
（2）伪类使用的是单冒号，但是在css3中规定伪元素使用的双冒号，但是除了少部分的伪元素必须使用双冒号以外，像after还有before都是支持单引号的。为了兼容性所以目前还是在使用一些常见的伪元素的时候采用单冒号较为稳妥。

一：伪类：
1:定义：css伪类用于向某些选择器添加特殊效果。
伪类其实与普通的css类相类似，可以为已有的元素添加样式，但是他只有处于dom无法描述的状态下才能为文档树中的元素添加样式，所以将其称为伪类。(这种文档树无法描述的状态是什么呢？当一个元素在用户的不同行为下就变化成不同的状态这个行为的变化dom就无法描述，就要产生伪类，来为一些选择器添加特殊的效果)。
2:什么是文档树（DOM）？：
DOM实际上是以面向对象的方式描述的文档模型，DOM定义了表示修改文档所需的对象，这些对象的行为和属性，以及这些对象之间的关系，所以可以吧DOM人文是页面上数据和结构的一个树形表示。

二：伪元素：

1:伪元素用于创建一些不在文档树中的元素，并且为他添加样式，举个例子：使用伪元素”：：before”可以在一个元素前边增加一些文本，并且可以为这些文本添加一些样式，虽然用户可以看到这写文本，但是这些文本是不存在于文档树中的

 

伪类  

：first-child向元素的第一个子元素添加样式
：lang向带有指定lang属性的元素添加样式

：focus向拥有键盘输入焦点的元素添加样式

 

表示链接的不同状态 必须按顺序书写

1.a：link（链接未访问）

2.a：visit（已访问链接）

3.a：hover（鼠标停在链接上方时）

4.a：active（鼠标点中激活链接时

 

伪元素

：：first-letter向文本的第一个字母添加特殊样式

：：first-line向文本的第一行添加特殊样式

：：before在元素之前添加内容

：：after在元素之后添加内容