伪元素与伪类的简单介绍

伪类是一个以冒号(:)做为前缀，被添加到一个选择器末尾的关键字，当你但愿样式在特定状态下才被呈现到指定的元素时，你能够往元素的选择器后面加上对应的伪类。

　　下面是几个比较经常使用的伪类选择器：

• :active CSS伪类匹配被用户激活的元素。

• :hover 会在光标（鼠标指针）悬停在元素上时提供关联的样式。

• :focus 表示得到焦点的元素（如表单输入）。

• :first-child 表示在一组兄弟元素中的第一个元素。

伪元素前缀是两个冒号 (::) ， 一样是添加到选择器后面去选择某个元素的某个部分。

　　下面是几个比较经常使用的伪元素选择器：

• ::before 建立一个伪元素，其将成为匹配选中的元素的第一个子元素。常经过 content 属性来为一个元素添加修 饰性的内容。此元素默认为行内元素。

• ::after 用来建立一个伪元素，做为已选中元素的最后一个子元素。一般会配合content属性来为该元素添加装 饰内容。这个虚拟元素默认是行内元素。

*::before和::after通常用于在css渲染中向元素逻辑上的头部或尾部添加内容。

这些添加不会出如今DOM中，不会改变文档内容，不可复制，仅仅是在css渲染层加入。

因此不要用:before或:after展现有实际意义的内容，尽可能使用它们显示修饰性内容，例如图标。

若是你们还想对伪类和伪元素有更多深刻的了解，请前往MDN进行了解学习，感谢你们的观看！

　　MDN连接：https://developer.mozilla.org/zh-CN/