一、在需要使用弹性盒子的容器上添加属性：display:flex 或者 display:inline-flex;
二、在父容器上添加flex-direction设置子元素主轴方向：
不写默认值是X轴从左到右
row:X轴从左到右
row-reverse X轴从右到左
column Y轴从上到下
column-reverse Y轴从下到上
三、设置在主轴方向的对齐方式justify-content
flex-start 整体左对齐
flex-end 整体右对齐
center 整体居中
space-between 据主轴两端平均分布
space-around 据主轴整体平均分布
四、设置在侧轴方向的对齐方式align-items
flex-start 侧轴左（上）
flex-end 侧轴右（下）
center 侧轴居中
stretch 侧轴伸展延伸布局（元素在侧轴方向没有宽高）
五、设置在侧轴方向(有多行的情况下整体内容)的对齐方式align-content
flex-start 侧轴左（上）
flex-end 侧轴右（下）
center 侧轴居中
space-between 据侧轴两端平均分布
space-around 据侧轴平均分布
stretch 侧轴伸展延伸布局（元素在侧轴方向没有宽高）
六、order属性控制顺序
在默认情况下flex里的元素会按照书写顺序排列，但是可以通过order属性改变，数值小的排列在前面，还可以是负数
.item{
order:0
}
欢迎加入大前端交流群！群号：277942610，VIP新群