Flex布局补充：
昨日回顾
主轴指的是x轴，侧轴指的是y轴
主轴=x轴=水平方向
侧轴=y轴=垂直方向
主轴只是说明水平的方向，没有多行的概念，多行只有侧轴才有
侧轴对齐
单行 侧轴
align-items:也有三个值（单行对齐）
- flex-start 上对齐
- flex-end 下对齐
- center 垂直居中
多行 侧轴
align-content:值也是一样的,区别在（多行对齐方式）
换行属性
- 默认情况下flex不会换行，当子元素的宽的大于父元素的时候，不会换行，只会挤压子元素的宽度
- 所以要添加换行属性：flex-wrap:wrap/no wrap不换行
设置主轴方向（作了解）
属性：flex-direction
- flex-direction：row 默认值 少用
- 水平方向从左到右
- flex-direction：row-reverse 少用
- 水平方向从右到左
- column 从上到下 会用
- column -reverse 从下到上 少用
当主轴方向发生改变后，原本的属性都会切换方向。x轴的属性变成y轴，y轴的属性变成x轴
设置子项均分父项的宽度
设置子项占父项宽度的比例
属性：flex：1；设置每一个span标签宽度都占一份
设置子项自己在侧轴上的对齐方式：
属性align-self:center flex-start end 少用
总结子项：
- 默认的宽度等于内容撑开
- 默认的高度等于父项的高
- flex：1设置子项的宽度
- align-seft设置子项在侧轴上的对齐
- 如果主轴改变了方向 columin
- 1，默认的高度，等于内容撑开
- flex 设置子项的高度
- align-seft 设置子项在侧轴上的对齐（水平）
- 默认的宽度等于父项的宽的
拓展知识：
关于几种布局的本质：
- flex 百分比 流式布局，一样！
- flex 自身的方式可以 元素的大小 相对大小
- 百分比 %单位实现 元素大小 相对元素大小
- 流式布局 别名而已
- flex布局=百分比布局=流失布局=自适应
- 响应式不一样！
关于内容居中，两种做法
固定定位拓展知识
使用场景：最底部支付拦定位
当使用固定定位底部时，因为固定定位是占位置的，会挡住标签的！！！因此如果想避免这种情况发生，可以在body底部的内padding标签**，标签值跟固定定位的高相同**，这样可以避免被挡住的标签看不到，用body的底部内padding把内容挤上来，挤上来的位置与固定定位的高度一样，这样就可以避免固定定位的弊端，挡住标签
固定定位用在其他位置也是同上所述，避开固定定位占位置的情况从而导致部分标签被遮盖看不到！
