flex布局

flex布局也叫弹性盒子布局

flex布局可用于调整盒子内盒子属性，排练方式等

首先我们先设置一个盒子嵌套三个盒子

 再用link导入我们的css文件代码

 设置大盒子的长和宽均为1000px

 在设置小盒子的长宽分别为

100px 100px

 200px 200px

 300px 300px

 输入display: flex开启弹性盒

  flex-direction涉资主轴方向 

 column自上而下

 column自下而上

 row从左到右

 row-reverse从右向左

 

center居中对齐

space-around:项目之间距离相等 

space-evenly:间隙相等

space-between:两端对齐，中间距离相等 

align-items:设置项目在交叉轴上的对齐方式

默认是x轴，交叉轴为纵轴，如果设置主轴时y轴，交叉轴就是x轴

baseline:基于第一行文字对齐，改变盒子位置

例图