1、首先对父元素设置disiplay：felx， 其有6个属性
fex-direction:设置主轴的方向
justify-content:设置主轴上的子元素排列方式
flex-wrap:设置子元素是否换行
align-content:设置侧轴上的子元素的排列方式(多行)
align-items:设置侧轴上的子元素排列方式(单行)
flex-flow:复合属性，相当于同时设置了flex-direction和flex-wrap
2、 justify-content 设置主轴上的子元素排列方式
3、align-items 设置侧轴上的子元素排列方式(单行)
4、align-content 设置侧轴上的子元素的排列方式(多行)
5、align-content 和 align-items 区别
align-items 适用于单行情况下，只有上对齐、下对齐、居中和拉伸
align-content适应于换行(多行)的情况下(单行情况下无效)，可以设置上对齐、下对齐、居中、拉伸以及平均分配剩余空间等属性值。
总结就是单行找 align-items 多行找 align-content
6、flex-flow 属性是 flex-direction和flex-wrap 属性的复合属性
flex-flow:row wrap;相当于flex-direction:row和flex-wrap:wrap
7、flex布局子项常见属性
- flex子项目占的份数
- align-self控制子项自己在侧轴的排列方式
- order属性定义子项的排列顺序（前后顺序）
7.1 flex属性
7.2圣杯布局
参考：09-子项flex属性使用_哔哩哔哩_bilibili
