align-items

align-items属性适用于所有的flex容器，它是用来设置每个flex元素在侧轴上的默认对齐方式。

align-items和align-content有相同的功能，不过不同点是它是用来让每一个单行的容器居中而不是让整个容器居中。

align-items

align-content

align-content属性只适用于多行的flex容器，并且当侧轴上有多余空间使flex容器内的flex线对齐。

下面举例：

html css

最终结果如下图

所以对于只有一行的flex元素，align-content是没有效果的，如果.child-1改用align-items:center;则会达到预期的效果，如下图

但如果变成多行容器使用align-items时效果如下

使用align-content效果如下