复盘-----自适应
容器属性：display-flex
1.flex-direction
2.flex-wrap
3.flex-flow
4.justify-content
5.align-items
6.align-content
1.flex-direction 主轴方向
row 从左到右
row-reverse 从右到左
column 从上到下
column-reverse 从下到上
2.flex-wrap 主轴换行
nowrap 不换行（默认）
wrap 换行
wrap-reverse 反转换行
3.flex-flow 主轴方向和换行的简写
flex-flow：column wrap；
4.justify-content 主轴对齐方式
center中心对齐
flex-start 左对齐
flex-end 右对齐
space-between 两端顶边对齐
space-around 左右边距对齐
5.align-items 交叉轴对齐方式
center垂直居中
flex-start 交叉轴开始
flex-end 交叉轴结束
baseline 文字基线对齐
stretch 文字基线拉伸（无高度）
6.align-content多主轴对齐方式
flex-end 两主轴底部对齐
flex-start 顶端
space-between 顶边两端对齐
space-around 边距两端对齐
strech 拉伸
center 居中对齐