display:box;box-flex是css3新添加的盒子模型屬性，它的出現可以解決我們通過N多結構、css實現的布局方式。經典的一個布局應用就是布局的垂直等高、水平均分、按比例劃分。

目前box-flex屬性還沒有得到firefox、Opera、chrome瀏覽器的完全支持，但可以使用它們的私有屬性定義firefox(-moz-)、opera(-o-)、chrome/safari（-webkit-)。

一、box-flex屬性

box-flex主要讓子容器針對父容器的寬度按一定規則進行劃分

test_box在這是是父元素 list_one..等等是其子元素;display:box;相當于只是一種聲明而已;只有聲明了子元素才可以對父元素進行劃分;

二、box屬性

1、box-orient(orient譯為排列更準確)用來確定父容器里子容器的排列方式，是水平還是垂直。可選屬性如下所示：

horizontal | vertical | inline-axis | block-axis | inherit

2、box-direction

box-direction用來確定父容器里的子容器排列順序，具體屬性如下代碼所示：

normal | reverse | inherit

3、box-align

box-align表示父容器里面子容器的垂直對齊方式，可選參數如下所示：

start | end | center | baseline | stretch

4、box-pack

box-pack表示父容器里面子容器的水平對齊方式，可選參數如下所示：

start | end | center | justify