一、结构伪类选择器能够使用 结构伪类选择器 在HTML中定位元素 在同父元素中有多个相同的子元素时使用。 在父元素中被选中的要第几个标签就写第几个，然后该标签是什么就写什么标签。
1、作用与优势
作用：根据元素在HTML中的结构关系查找元素
优势：减少对于HTML中类的依赖，有利于保持代码整洁
场景：常用于查找某父级选择器中的子元素
2、选择器 有以下几种E表示父元素比如父元素是li 就是 li:first-child{}来添加css的样式
E：first-child{} 表示匹配父元素中第一个子元素，并且是E元素
E：last-child{}表示匹配父元素中最后一个元素，并且是E元素
E：nth-child（n）{}表示匹配父元素中的第n个元素并且是E元素
E：nth-last-child（n）{}表示父元素中倒数第n个元素并且是E元素
奇数行是2n-1
偶数行是2n
前五个是-n+5
从第五个往后是n+5
二、伪元素能够使用 伪元素 在网页中创建内容 属性是content 默认显示模式是行内元素。
1、伪元素：一般页面中的非主体内容可以使用伪元素元素：HTML 设置的标签而伪元素：由 CSS 模拟出的标签效果。可以盖在父元素上显示。
2、种类
：：before表示在父元素的最前面添加一个伪元素
：：after表示在父元素内容的最后添加一个伪元素
备注：必须设置content属性才能生效，伪元素默认是行内元素。
三、标准流
目标：能够认识 标准流 的默认排布方式及其特点
标准流：又称文档流，是浏览器在渲染显示网页内容时默认采用的一套排版规则，规定了应该以何种方式排列元素
标准流中块级元素的排版规则是从上往下、垂直布局、独占一行
标准流中行内元素或行内块元素的排版规则是左往右、水平布局、空间不够自动折行
四、浮动标签是float（left、right）左浮动、右浮动。
1、浮动的作用：图文环绕、网页布局
网页布局场景：让垂直布局的盒子变成水平布局，如：一个在左，一个在右
2、浮动的特点
浮动元素会脱离标准流（简称：脱标），在标准流中不占位置 相当于从地面飘到了空中
浮动元素比标准流高半个级别，可以覆盖标准流中的元素
浮动找浮动，下一个浮动元素会在上一个浮动元素后面左右浮动
浮动元素有特殊的显示效果一行可以显示多个可以设置宽高，跟行内块一样且比行内块高级。
备注：浮动的元素不能通过text-align:center或者margin:0 auto实现居中效果。
书写网页导航步骤：
清除默认的margin和padding
找到ul，去除小圆点
找到li标签，设置浮动让li一行中显示
找到a标签，设置宽高 → a标签默认是
内元素，默认不能设置宽高？
方法一：给a标签设置 display : inline-block
方法二：给a标签设置 display : block
方法三：给a设置 float : left
五、清楚浮动 (能够认识清除浮动的目的，并且可以使用清除浮动的方法)
1、清除浮动的介绍
含义：清除浮动带来的影响
影响：如果子元素浮动了，此时子元素不能撑开标准流的块级父元素
原因：子元素浮动后脱标 → 不占位置
目的：需要父元素有高度，从而不影响其他网页元素的布
2、清除方式
① 直接设置父元素高度
优点：简单粗暴，方便
缺点：有些布局中不能固定父元素高度。如：新闻列表、京东推荐模块
② 额外标签法比较常用
操作：
在父元素内容的最后添加一个块级元素
给添加的块级元素设置 clear:both（清除左右两边的影响。）
缺点：会在页面中添加额外的标签，会让页面的HTML结构变得复杂
③ 单伪元素清除法比较常用
操作：用伪元素替代了额外标签
优点：项目中使用，直接给标签加类即可清除浮动
visibility:hideen
height:0
④ 双伪元素清除法
优点：项目中使用，直接给标签加类即可清除浮动
⑤ 给父元素设置 overflow : hidden 经常使用
操作：
直接给父元素设置 overflow : hidden
特点：优点：方便
去除无序列表的点 list-style：none
（拓展补充）BFC的介绍
块格式化上下文（Block Formatting Context）：BFC
是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。
➢ 创建BFC方法：
html标签是BFC盒子
浮动元素是BFC盒子
行内块元素是BFC盒子
overflow属性取值不为visible。如：auto、hidden…
BFC盒子常见特点：
BFC盒子会默认包裹住内部子元素（标准流、浮动）→ 应用：清除浮动
BFC盒子本身与子元素之间不存在margin的塌陷现象 → 应用：解决margin的塌陷
