flex布局
禁止收缩
flex-shrink: 0;
宽高充满
flex:1;
注意：除了要设置flex:1之外，还要根据布局方向，如果是row则width:0, 如果是column则height:0
常用属性
水平方向对齐
justify-content: flex-start;起始端对齐
justify-content: flex-end;末尾段对齐
justify-content: center;居中对齐
justify-content: space-around;均匀分布
justify-content: space-between;两端对齐，中间均匀分布
垂直方向对齐
align-items:flex-start; 起始端对齐
align-items:flex-end; 末尾端对齐
align-items:center; 居中对齐
align-items:baseline; 基线对齐，这里的baseline默认是指首行文字
align-items:stretch; 子容器沿交叉轴方向的尺寸拉伸至与父容器一致。
属性值说明
flex-start： 起始端对齐
flex-end： 末尾段对齐
center： 居中对齐
space-around： 子容器沿主轴均匀分布，位于首尾两端的子容器到父容器的距离是子容器间距的一半。
space-between： 子容器沿主轴均匀分布，位于首尾两端的子容器与父容器相切。
flex-start：起始端对齐
flex-end： 末尾段对齐
center： 居中对齐
baseline： 基线对齐，这里的 baseline 默认是指首行文字，即 first baseline，所有子容器向基线对齐，交叉轴起点到元素基线距离最大的子容器将会与交叉轴起始端相切以确定基线。
stretch： 子容器沿交叉轴方向的尺寸拉伸至与父容器一致。
