弹性盒子布局——flex

在flex中所有元素都是行内块元素
flex中有两条轴，一个主轴，元素的排列方向；
                一个交叉轴，元素的换行方向；

flex容器的属性

flex-flow：主轴方向与换行方式
justify-content：主轴上的对齐方式
align-items：交叉轴上的对齐方式
align-content：在多行容器中的对齐方式

项目属性

flex：缩放比例与基准宽度
align-self：单个项目在交叉轴上的对齐方式
order：项目在主轴上的排列顺序
flex：flex-grow flex-shrink flex-basis
flex：放大 收缩 在主轴上的基准宽度
允许放大收缩：
    flex: 1 1 auto;
不允许放大收缩：
    flex: 0 0 auto;
flex:1;//表示的是允许放大收缩
flex:2;//大小是flex:1的2倍
order:0;在order:1;的前边排列，支持负值;