Flex的核心是容器和轴，容器指父级容器和子容器，轴指主轴和交轴。
轴：
主轴：justify-content；flex-direction 决定主轴的方向
flex-direction: row 向右
flex-direction: column 向下
flex-direction: row-reverse 向左
flex-direction: column-reverse 向上
交叉轴：align-items；
Flex进阶概念
父容器：
flex-wrap 设置换行方式
nowrap：不换行
wrap：换行
wrap-reverse：逆序换行
flex-flow 轴向与换行组合设置
flow 即流向，也就是子容器沿着哪个方向流动，流动到终点是否允许换行，比如 flex-flow: row wrap
align-content 多行沿交叉轴对齐
当子容器多行排列时，设置行与行之间的对齐方式。
位置排列：
flex-start 起始端对齐
flex-end 末端对齐
center 居中对齐
分布排列：
space-between 首尾端到父级容边距是子容器之间边距的一半
space-around 首尾端均匀对齐分步
拉伸排列：
stretch 子容器沿交叉轴方向的尺寸拉伸至与父容器一致
子容器：
flex-basis 设置基准大小
flex-grow 设置扩展比例
flex-shrink 设置收缩比例
order 设置排列顺序