flex布局

直接在父元素上 display: flex;justify-content: center; align-items: center; 内部子元素会自动水平居中

默认：flex-direction（滴瑞爱格寻）: row （肉） 水平方向 column（靠冷） 垂直方向
加row-reverse（瑞沃斯） 方向反过来
flex-wrap：nowrap （默认不换行） wrap （乳啊） 换行
justify-content:flex-start; 左对齐默认
justify-content:flex-end; 右对齐
justify-content:center; 居中对齐
justify-content:space-between; 两端对齐
justify-content:space-around; 两端按中间对齐（额绕得）

交叉轴对齐
align-items:center; 垂直居中
align-items:flex-start; （最上方）
align-items:flex-end; (最下方)
align-items:stretch; 上下全占满 (斯最曲)
align-items:baseline; 按字体对齐 默认值