更换flex主轴方向
flex-direction: row; 默认值
设置了column之后
主轴方向变成了从上到下 侧轴从左到右
flex-direction: column;
弹性盒子换行显示
display: flex;
强制让所有的子元素强制一行显示
超出父元素也不会换行(打死不换行)
flex-wrap: wrap;
让子元素换行显示
多行侧轴对齐方式
单行侧轴的对齐方式
align-items:
stretch 拉伸
flex-start 从轴线开始对齐
flex-end 从轴线结束对齐
center 居中
align-content: 多行侧轴的对齐方式 是和 flex-wrap: wrap; 一起使用
stretch 拉伸 默认
center
与justify-content的对齐方式一样
space-between
space-around
space-evenly