伪类选择器

1、a标签四大伪类

• :link 未访问状态
• :hover 悬浮状态
• :active 活跃状态(被鼠标点击中)
• :visited 已访问状态

2、内容伪类

• :before 内容之前
• :after 内容之后

:before, :after {
    content: "ctn";
}

3、索引伪类

• :nth-child(n) 位置优先，再匹配类型
• :nth-of-type(n) 类型优先，再匹配位置

v_hint：值可以为位置数，也可以为2n、3n...，代表2的倍数，3的倍数，且位置数从1开始

/*先匹配位置,再匹配类型: 找到所有结构下的第2个标签,如果刚好是div,那么匹配成功*/
div:nth-child(2) {
    color: green;
}
        
/*先确定类型,再匹配位置*/
/*先将页面中所有div找出,在匹配那些在自己结构层次下的第二个div*/
div:nth-of-type(2) {
    color: cyan;
}

4、取反伪类

• :not(selector)：对selector进行取反