伪元素和伪类选择器

伪元素和伪类使用

前两天分享了两个题目，今天老师又讲了一边伪元素和伪类使用，说实话还是有一点混，我整理了一下。分享一下吧

一.概念

两个选择器的异同

伪类选择器是用来向某些选择器来添加效果。不修改DOM内容，通过一些特定的选择器根据特定的状态、特定条件来修改元素的样式。比如：悬停（hover）、点击（active）以及文档中不能通过其它选择器选择的元素（这些元素没有 ID 或 class 属性），例如第一个子元素（first-child）或者最后一个子元素（last-child）。

伪元素选择器是一个附加在选择器末尾的关键词，通过伪元素不需要借助元素的 ID 或 class 属性就可以对被选择元素的特定部分定义样式。例如通过伪元素可以设置段落中第一个字母的样式（::first-letter），或者在元素之前（::before）之后插入一些内容（::after）等等。伪元素可能改变DOM结构，创造了虚拟的DOM。

常见的伪元素选择器

常见的伪类选择器