本文介绍了CSSFlexbox中的align-content属性，它用于控制多行flex容器的对齐方式。当配合flex-wrap属性使用时，align-content展现出其效果，如space-around和space-between的差异。space-around会在两侧预留空间进行均匀分布，而space-between则在两端不留空隙，元素间均匀间隔。
结论 ：
1：共同点：它们对齐方向为交叉轴
2：不点：align-content 应用于为 多行 而 align-items:应用于同单行。
解析如下：
1.设置四个盒子 大盒子设置flex
2.设置 align-items: center; - ----- 发现居中对齐了
3.align-items: flex-end; ----- 可以看到 尾部对齐了
4. align-content: space-around ----- 在这个时候我们去修改 发现并没有效果
5.当我们去添加一个 flex-wrap: wrap; 的时候 发现 分布对齐了
是因为align-content: 属性是基于多行去做的 flex-wrap: wrap 是变成多行的重要前提
6. 我们继续修改 align-content: space-between 发现 靠近顶部和底部分布对齐了
那么到这里有人要问了 :
align-content: space-around
align-content: space-between 区别是什么呢
这里说一下，
align-content: space-around 是两侧预留一部分 然后分布对齐
align-content: space-between 是完全两侧分布对齐 不留任何空隙 
455
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
