一種布局方式，彈性布局，六個屬性
flex-direction：
flex-direction:row; 從左向右
flex-direction:column; 從上到下
flex-direction:row-reverse;從右到左
flex-wrap：
flex-wrap: nowrap；不換行
flex-wrap: wrap；順序換行
flex-wrap: wrap-reverse；倒著換行（算你狠）
justify-content：
justify-content : center;元素居中排列
justify-content : flex-start;元素從左開始排列
justify-content : flex-end;元素從右開始排列
justify-content : space-between;元素間間隔，兩端會靠邊
justify-content : space-around;類似與元素間左右padding
align-items：
align-items : flex-start;元素縱向，向上最齊
align-items : flex-end;元素縱向，向下最齊
align-items : center;元素縱向，居中最齊
align-items : baseline；元素一條線對齊
align-items: stretch;元素上下填滿
align-content：
align-content: flex-start;元素內(nèi)容縱向，從上到下
align-content: flex-end，元素內(nèi)容縱向，從下到上
align-content: stretch，垂直方向居中
align-content: center；元素被拉伸以占滿容器
align-content: space-between;平均分布，中間留空白
align-content: space-around;類似于上下padding
參考鏈接1：http://www.itdecent.cn/p/d9373a86b748/
參考鏈接2：https://developer.mozilla.org/en-US/docs/Web/CSS/align-content
