1、在使用彈性盒模型的時候父元素必須要加display:box 或 display:inline-box:
新版彈性盒模型：flex：display : flex
老版彈性盒模型：box : display : -webkit-box
2、box-orient 定義盒模型的主軸方向
新版：flex：flex-direction: row / column
老版：box : -webkit-box-orient:
horizontal 水平顯示
vertical 垂直方向
3、box-direction 元素排列順序
新版：flex : flex-direction: row-reverse / column-reverse;
老版：box : -webkit-box-direction:
normal 正序
reverse 反序
4、box-pack 主軸方向富裕的空間管理
新版：flex : justify-content : flex-start / flex-end / center / space-between / space-around;
老版：box : -webkit-box-pack
start 所有子元素在盒子左側顯示，富裕空間在右側
end 所有子元素在盒子右側顯示，富裕空間在左
center 所有子元素居中
justify 富裕空間在子元素之間平均分布
5、box-align 側軸方向方向富裕的空間管理
新版：flex : align-items : flex-start / flex-end / center / baseline
老版：box : -webkit-box-align
star 所有子元素在據頂
end 所有子元素在據底
center 所有子元素居中
6、Box-flex 定義盒子的彈性空間
新版：flex : flex-grow
老版：box : -webkit-box-flex
子元素的尺寸=盒子的尺寸*子元素的box-flex屬性值 / 所有子元素的box-flex屬性值的和
7、box-ordinal-group 設置元素的具體位置
新版：flex : order
老版：box : -webkit-box-ordinal-group