# 定义

伪元素： 在CSS渲染文档的时候，可以用CSS中的伪元素向HTML添加一个虚拟元素(标签)。
这个元素在文档树中是找不到的，伪元素被当做CSS的样式来展现。用法和普通元素一样。
伪元素： 通过CSS选择器，格式化DOM元素树之外的信息以及不能被常规CSS选择器所捕获到的信息

# 常用的伪类和伪元素

# 伪类

# 伪元素

# 伪元素和伪类的区别

伪元素： 本质上添加一个页面中没有的虚拟容器( 元素 )
只是视觉上添加了，在文档树中是没有添加的。我们可以向这个虚拟元素添加内容或样式。

<p>Hello World</p>
p::first-letter {
    color: red;
}

<!-- 以上的代码本质上是 -->
<p><span class="first-letter" >H</span>ello, World</p>
.first-letter {
    color: red;
}

伪类： 是为了弥补了CSS选择器的不足，用来更加方便地获取信息。
可以选择元素的状态( :link, :hover 等)。也可以选择第一个元素( :first-child )这样CSS选择器无法做到的。

<ul>
    <li>这是第一行</li>
    <li>这是第二行</li>
    <li>这是第三行</li>
</ul>

li: first-child {
    color: red;
}