结构伪类选择器与伪元素选择器

概要

       结构伪类选择器是CSS中的一种选择器，用于基于文档结构选择元素。这些选择器通常用于模仿或者替代JavaScript中的事件处理器，使得你可以仅通过CSS样式就能对文档中的某些结构位置或者状态进行样式设计。结构伪类选择器能够选择元素在其生命周期中的特定时刻的状态，比如当用户悬停在链接上时，或者当元素是其父元素的第一个子元素时。

以下是一些常用的结构伪类选择器：
:hover - 选择鼠标悬停在上面的元素。（常用于导航条）
:focus - 选择拥有焦点的元素。
:active - 选择被激活的元素（例如，被点击的链接）。
:visited 和 :link - 分别选择已访问和未访问的链接。
:first-child 和 :last-child - 选择某个元素的第一个或最后一个子元素。
:nth-child() - 选择某个元素的第二个、第五个等指定索引的子元素。
:not() - 选择不符合指定规则的元素。

       伪元素选择器是CSS中用来选择和 style 某些特定的行内元素或者文档中的特定位置（比如在某个元素之前或者之后）的一种机制。它们通常用来在不改变文档结构