携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第6天，点击查看活动详情
1.align-items设置侧轴上的子元素排列方式(单行)
该属性是控制子项(单行)在侧轴(默认是y轴)上的排列方式
flex-start:默认值从上到下
flex-end:从下到上
center:挤在一起居中（垂直居中）
stretch:拉伸(但是如果沿着y轴拉伸，盒子不要给高度)
2.align-content设置侧轴上的子元素排列方式(多行)
设置子项在侧轴上的排列方式并且只能用于子项出现换行的情况（多行），在单行下是没有效果的。
flex-start:默认值在侧轴的头部开始排列
flex-end:在侧轴的尾部开始排列
center:在侧轴中间显示
space-around:子项在侧轴平分剩余空间
space-between:子项在侧轴先分布在两头，再平分剩余空间
stretch:设置子项元素高度平分父元素高度
3.align-items和align-content区别
align-items适用于单行情况下，只有上对齐、下对齐、居中和拉伸
align-content适应于换行（多行）的情况下（单行情况下无效），可以设置上对齐、下对齐、居中、拉伸以及平均分配剩余空间等属性值。
总结就是单行找align-items
多行找align-content
4.flex-flow
flex-flow属性是flex-direction和flex-wrap属性的复合属性。
flex-flow:row wrap
即为主轴x轴，自动换行
子项属性
接下来主要介绍子项常见属性，之前为父项属性
flex子项目占的份数
align-seLf控制子项自己在侧轴的排列方式
order属性定义子项的排列顺序（前后顺序）
1.flex属性
flex属性定义子项目分配剩余空间，用flex来表示占多少份数 例如:
.span{
flex:<number> 默认值是0
}
即可实现左侧右侧固定，中间盒子自适应的效果
父元素设置高和宽，固定的子元素也设置高和宽，剩余空间自适应的盒子用flex属性分配
2.align-self控制子项自己在侧轴上的排列方式
align-self属性允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性.
默认值为auto,表示继承父元素的align-items属性，如果没有父元素，则等同于stretch。
3.order属性定义项目的排列方式
数值越小，排列越靠前，默认为0。
PS：和z-index不一样.
