flex-direction: row | row-reverse | column | column-reverse;
/* row(從左到右) --預設
row-reverse(從右到左)
column(從上到下)
column-reverse(從下到上)
/* nowrap(不換行，佔滿一行會被擠小) --預設
wrap(換行)
wrap-reverse(換行,第一行在後面)
/* flex-start(左或上對齊)
flex-end(右或下對齊)
center(居中對齊)
space-between(左右或上下對齊，中間空隙平分)
space-around(平分空隙)
/* flex-start (垂直軸的頭部對齊)
flex-end (垂直軸的尾部對齊)
center (垂直軸的中心對齊)
baseline (每個子元素的第一行文字的基線對齊)
stretch (如果子元素沒有設定高度或者高度auto，怎沾滿父元素的高度) --預設
/* flex-start (左或上對齊)
flex-end (右或下對齊)
center (居中對齊)
space-between(左右或上下對齊，中間空隙平分)
space-around(平分空隙)
stretch (軸線佔滿整個交叉軸) --預設
/* 預設值為0，數值越小，越靠前
/* 預設值為0，表示都不會擴大，注意取值》=0,負數不生效;
左右排列(row)，只擴大寬;
上下排列(column)，只擴大高
/* 預設值為1,表示當空間不夠時,會縮小;
設定為0時,空間不足時，不會縮小
/* 預設值為 auto，
在分配多餘空間之前,定義專案佔據的空間，一般多和flex-grow、flex-shrink一起使用
它可以設為跟width或height屬性一樣的值（比如350px），則專案將佔據固定空間。
*/
flex: flex-grow flex-shrink flex-basis
/* 預設值為 0 1 auto
建議優先使用這個屬性，而不是單獨寫三個分離的屬性，因為瀏覽器會推算相關值。
*/
align-self: auto | flex-start | flex-end | center | baseline | stretch;
/* 與在父元素中的align-items類似，只不過是單獨設定某元素的對齊方式
Flex彈性布局總結
一 在容器box上設定的屬性 二 在item專案上設定的屬性 一 在容器box上設定的屬性 前提 display flex 或display inline flex 注意 容器設為flex布局以後，子元素item的float clear和vertical align屬性將失效。item專案的排列方向...
flex布局（彈性布局）
flex是flexible box的縮寫，意為 彈性布局 用來為盒狀模型提供最大的靈活性。任何乙個容器都可以指定為flex布局。box行內元素也可以使用flex布局。boxwebkit核心的瀏覽器，必須加上 webkit字首。box注意，設為flex布局以後，子元素的float clear和vert...
Flex布局（彈性布局）
flex是flex box的縮寫，即彈性布局。任何乙個容器都可以指定為flex布局。行內元素也可以使用flex布局。webkit核心的瀏覽器，必須加上 webkit字首。box.box.box注意 設為flex布局以後，子元素的float clear和vertical align屬性將失效。採用fl...