flex
四大概念：
容器，项目，主轴，交叉轴
容器：如果在一个盒子上面，设置display:flex，那么这个盒子就是一个容器
项目：容器的直接子元素，叫项目
主轴：在容器中，项目默认是按主轴方向排列，默认是从左向右排列
交叉轴：与主轴垂直的那个轴
容器相关的属性：
flex-direction：改变主轴方向 row column row-reverse column-reverse
flex-wrap:项目足够多的时候，是否换行 wrap nowrap
* flex-flow:flex-direction属性和flex-wrap属性的简写形式，默认值为row nowrap
justify-content:处理富余空间 flex-start flex-end center space-between space-around align-items: 定义项目在交叉轴上如何对齐 flex-start flex-end center
align-content : 当有多根主轴时，多根主轴的对齐方式。相当于处理垂直方向上的富余空间。 项目相关的属性：
order：是用来改变项目的顺序的
flex-grow：让某个项目生长
flex-shrink：让某个项目压缩
flex-basis：项目在主轴上占据的大小
flex：上面几个属性的简写方式
align-self：单独设置某个项目的对齐方式,单独一个项目在交叉轴的对齐方式
