flex布局 父元素属性之 align-content 子元素在侧轴上的排列方式（多行子元素）

align-content

align-content：设置多行子元素在侧轴上（默认侧轴为y轴）的排列方式
注意：该属性只对父元素中有换行情况的子元素有效，即父元素代码中有“ flex-wrap：wrap；”，才会对子元素有效

align-content的属性值：

属性值	含义
flex-start	子元素在侧轴的头部开始排列 （默认值）
flex-end	子元素在侧轴的尾部开始排列
center	子元素在侧轴上居中显示
space-around	子元素在侧轴上平分剩余空间
space-between	子元素线贴着侧轴的两边，再平分剩余空间
stretch	设置子元素高度，平分父元素高度

---

对以上几个属性值进行举例解释（以y轴为侧轴为列）：

flex-start

	1
	2
	3
	4
	5
	6

运行结果：子元素从侧轴的头部开始排列

flex-end

	1
	2
	3
	4
	5
	6

运行结果：子元素从侧轴的尾部开始排列

center

	1
	2
	3
	4
	5
	6

运行结果：子元素在侧轴上居中对齐

space-around

	1
	2
	3
	4
	5
	6

运行结果：子元素在侧轴上平分剩余空间

space-between

	1
	2
	3
	4
	5
	6

运行结果：子元素先贴着侧轴的两边，再平分侧轴上的剩余空间

stretch

	1
	2
	3
	4
	5
	6

运行结果：除去子元素所占高度，再平分父元素高度
上述如果没有给子元素设置高度，运行结果为：（没有给子元素设置高度，这两行子元素平分父元素高度）