父標籤：
display:flex;
flex-direction: row | row-reverse 橫向
(起點方向) rolumn | rolumn-reverse 縱向
flex-wrap: nowrap | wrap | wrap-reverse
（換**況）
flex-flow: direction 與 wrap 結合 (兩個變數)
justify-content（主軸上對齊方式）:
flex-start（左） | flex-end（右） | center（居中）
space-between(兩端對齊（貼邊）) | space-around(兩端對齊（不貼邊）)
align-items（交叉軸上對齊）:
flex-start（起點） | flex-end（終點） | center
stretch(預設)（無height或為auto時佔滿） | baseline（第一行文字基線）
align-content（多根軸線的對齊方式）（只有一根時不起作用）：
flex-start（起點） | flex-end（終點）
center（居中） | space-between（交叉軸兩端、軸平均）
space-around（兩邊不貼） | stretch（預設）（佔滿交叉軸）
css彈性布局（flex）
1 概念解讀 傳統的布局解決方案，基於盒狀模型，依賴 display 屬性 position屬性 float屬性。但對於一些特殊的布局方式 如垂直居中 傳統盒模型顯得有點力不從心，而對彈性布局 flex 來說卻很容易實現。2009年，w3c 提出了一種新的方案 flex 布局 flex是flexib...
css的flex彈性布局
效果1 給容器設定屬性justify content space evenly，紅色矩形之間的距離相等。除了space evenly值以外，還有sapce between space around 設定屬性align items center 容器內的專案垂直居中。html 效果二 給容器設定屬性a...
css布局之彈性布局flex
作用 彈性布局flex能按照我們的設定自動計算各子元素之間的間距並將之布局好，而不需要像定位那樣手動計算布局。彈性布局是定義在乙個父容器中，加上display flex樣式使父容器的布局方式成為彈性布局。父容器中的子元素都會成為行內塊，預設所有子元素橫向排列，子元素的float clear和vert...