一.结构伪类选择器
1.作用与优势
作用：根据元素在HTML中的结构关系查找元素
优势：减少对于HTML中的类的依赖，有利于保持代码整洁
场景：常用于查找某父级选择器中的子元素
2.选择器
| 选择器 | 说明 |
| E：first-child{} | 匹配父元素中第一个子元素，并且是E元素 |
| E: last-child{} | 匹配父元素中最后一个子元素，并且是E元素 |
| E:nth-child(n){} | 匹配父元素中第n个子元素，并且是E元素 |
| E:nth-last-child(n）{} | 匹配父元素中倒数第n个子元素，并且是E元素 |
二.伪元素
一般页面中的非主体内容可以使用伪元素
区别：
1.元素：HTML设置的标签
2.伪元素：由CSS模拟出的标签效果
种类：
| 伪元素 | 作用 |
| ：：before | 在父元素内容的最前添加一个伪元素 |
| ：：after | 在父元素内容的最后添加一个伪元素 |
注意点：
1.必须设置content属性才能生效
2.伪元素默认是行内元素
三.浮动
早起作用：图文环绕
现在作用：网页布局
特点：
浮动元素会脱离标准流在标准流不占位置
浮动元素比标准高半个级别，可以覆盖标准流中的元素
浮动找浮动，下一个浮动元素会在上一个浮动元素后面左右浮动
浮动有特殊的显示效果：一行可以显示多个 可以设置宽高
四.清除浮动
含义：清除浮动带来的影响
影响：如果子元素浮动了，此时子元素不能撑开标准流的块级父元素
原因：
子元素浮动后脱标 ->不占位置
目的：
需要父元素有高度，从而不影响其他网页元素的布局