设置flex-direction: column;(列)
主轴方向变成了从上到下
侧轴从左到右
flex-direction: row; 默认值(行)
侧轴对齐方式的异同
align-items: 是单行侧轴的对齐方式
stretch 拉伸
center 居中
flex-start 从轴头部开始
flex-end 从轴尾部开始
align-content: 是多行侧轴的对齐方式
flex-wrap: wrap; (换行属性 配合以下一起使用 默认值:stretch 拉伸)
flex-start 从轴头部开始
flex-end 从轴尾部开始
center 居中
space-between 两端对齐居中
space-around 间隙环绕每个盒子居中
space-evenly 间隙相同居中
扩展内容
当内容不确定是可设置内容上线和下线的高度
min-height: 100px;下线高度
max-height: 100px;上线高度
