注意

父元素设置display:flex

主轴对齐

相关信息

使用justify-content属性设置主轴对齐
使用align-content设置换行后主轴对齐

属性值	说明
flex-start	默认值
flex-end	终点开始
center	居中排列
space-around	均匀分布，空白在盒子两侧
space-between	均匀分布，空白在相邻盒子两侧
space-evenly	弹性盒子与容器之间距离相等

侧轴对齐

提示

使用align-items属性
使用align-self控制单个盒子

属性值	说明
flex-start	默认值
flex-end	终点开始
center	居中排列
stretch	默认值

主轴方向

相关信息

flex-direction

属性值	说明
row	行
column	列
row-reverse	行（反）
column-reverse	列（反）

换行

注意

父元素设置flex-wrap