在一个 flex 容器里，如果项目是在多行显示 .. 使用 align-content 这个属性，我们可以调整这些项目在容器里的垂直方向的对齐方式 ..

这里我设置了一下容器的高度 .. 还有把它的 flex-warp 属性设置成了 wrap ，这样项目会在多行显示 ..

在这个容器里，我们再添加一个 align-content 属性 .. 这个属性的值默认是 stretch .. 就是你现在看到的这种拉伸的对齐方式 .. 这样不同行的项目会被拉伸，占满容器的高度 ..

把它的值再设置成 flex-start .. 现在它们会靠着 cross 轴的起点显示 .. 也就是在容器的顶部开始显示，并且这些项目的高度不会被拉伸 ..

让它们在容器的底部显示的话， 可以用一个 flex-end .. 想让它们居中，可以使用 center 这个作为 align-content 这个属性的值 ..

在不拉伸项目高度的情况下，我们可以利用容器里这些剩下的垂直方向的空间 .. 使用一个 space-between .. 它会在项目的行与行的中间添加间隔 ..

再试一下 space-around ... 这个值会在项目的行的周围去添加间隔，这个间隔的大小取决于容器垂直的方向剩下的空间 ..