flex弹性布局

容器默认存在两根轴：
水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。

1.容器的属性
flex-direction   方向
flex-wrap	是否换行
flex-flow    方向 好换行 的简写。默认 row 和 nowrap
**justify-content**  主轴的排序方式  [ˈdʒʌstəˌfaɪ]  整理版面;
重点：
	flex-start 左对齐
	flex-end 右对齐
	center 居中
	space-between 两端对齐，项目之间等距离隔开
	space-around  每个项目两侧相等。
align-items  交叉轴的排列方式
	flex-start 靠上
	flex-end 靠底
	flex-center 居中
	baseline 项目的第一行文字的基线对齐
	stretch 默认，占满
align-content   多轴的情况

6个属性设置在项目上。
order  	数值越小，排列越靠前，默认为0。
flex-grow   放大比例，默认为0，即如果存在剩余空间，也不放大
flex-shrink	缩小比例，默认为1，即如果空间不足，该项目将缩小
flex-basis	项目固定大小
flex  放大，放小，固定大小，三个的简写
align-self  交叉轴上 特定效果