结构伪类

一、结构伪类选择器

1、作用与优势：

1. 作用：根据元素在HTML中的结构关系查找元素
2. 优势：减少对于HTML中类的依赖，有利于保持代码整洁
3. 场景：常用于查找某父级选择器中的子元素

2、选择器

选择器	说明
E:first-child{}	匹配父元素中第一个子元素，并且是E元素
E:last-child{}	匹配父元素中最后一个子元素，并且是E元素
E:nth-child(n){}	匹配父元素中第n个子元素，并且是E元素
E:nth-last-child(n){}	匹配父元素中倒数第n个子元素，并且是E元素

 n的注意点：

1、n为：0、、1、2、3、4、5、6、......

2、通过n可以组成常见公式

功能	公式
偶数	2n、even
奇数	2n+1、2n-1、odd
找到前5个	-n+5
找到从第5个往后	n+5

 二、伪元素

伪元素：一般页面中的非主体内容可以使用伪元素

区别：

1、元素：HTML设置的棱

2、伪元素：由CSS模拟出的标签效果

种类：

伪元素	作用
::before	在父元素内容的最前添加一个伪元素
::after	在父元素内容的最后添加一个伪元素

 注意点：

1、必须设置content属性才能生效

2、伪元素默认是行内元素

标签：匹配,伪类,元素,HTML,child,2n,选择器,结构
来源： https://www.cnblogs.com/lkim/p/16482584.html