弹性布局的理解

页面中任何一个元素设置了display:flex属性，那么当前盒子都称为弹性布局。弹性布局默认有两条轴。默认水平显示的是主轴，始终垂直主轴的侧轴（也叫交叉轴）。弹性盒子中的所有子元素都是沿着主轴方向显示。
弹性布局中有属性需要明白的是
items:代表全部flex子项目
content:代表整体
align: 代表垂直
justify 代表水平
self：表示单个元素，是flex子项的属性
这四个属性可以对其进行组合：比如，如果已水平方向为主轴，justify-content:表示整体的水平布局方式，align-items:表示所有全局的垂直布局方式。等等
弹性布局还可以通过order属性的大小对flex子项进行排序。通过flex-grow属性对盒子进行放大，使用flex-shark属性对象flex在宽度不足的时候进行缩小。使用flex-basic保证其基本大小