Webkit內(nèi)核的瀏覽器，必須加上-webkit前綴。
.box{
? ? ? ? ? ?display:-webkit-flex;/* Safari */
? ? ? ? ? display:flex;
}
flex-direction
row（默認(rèn)值）：主軸為水平方向，起點(diǎn)在左端。
row-reverse：主軸為水平方向，起點(diǎn)在右端。
column：主軸為垂直方向，起點(diǎn)在上沿。
column-reverse：主軸為垂直方向，起點(diǎn)在下沿。
flex-wrap
nowrap （默認(rèn)）：不換行。
wrap：換行，第一行在上方。
wrap-reverse：換行，第一行在下方。
flex-flow屬性是flex-direction屬性和flex-wrap屬性的簡(jiǎn)寫形式，默認(rèn)值為row nowrap。
justify-content
flex-start（默認(rèn)值）：左對(duì)齊
flex-end：右對(duì)齊
center： 居中
space-between：兩端對(duì)齊，項(xiàng)目之間的間隔都相等。
space-around：每個(gè)項(xiàng)目?jī)蓚?cè)的間隔相等。所以，項(xiàng)目之間的間隔比項(xiàng)目與邊框的間隔大一倍。
align-items ? ? ?
屬性定義項(xiàng)目在交叉軸上如何對(duì)齊。
flex-start：交叉軸的起點(diǎn)對(duì)齊。
flex-end：交叉軸的終點(diǎn)對(duì)齊。
center：交叉軸的中點(diǎn)對(duì)齊。
baseline: 項(xiàng)目的第一行文字的基線對(duì)齊。
stretch（默認(rèn)值）：如果項(xiàng)目未設(shè)置高度或設(shè)為auto，將占滿整個(gè)容器的高度。
flex-grow屬性定義項(xiàng)目的放大比例，默認(rèn)為0，即如果存在剩余空間，也不放大。
flex-shrink屬性定義了項(xiàng)目的縮小比例，默認(rèn)為1，即如果空間不足，該項(xiàng)目將縮小。
align-self屬性允許單個(gè)項(xiàng)目有與其他項(xiàng)目不一樣的對(duì)齊方式，可覆蓋align-items屬性。默認(rèn)值為auto，表示繼承父元素的align-items屬性，如果沒有父元素，則等同于stretch。
該屬性可能取6個(gè)值，除了auto，其他都與align-items屬性完全一致。
