.div
inline-flex：將物件作為內聯塊級彈性伸縮盒顯示(寬度撐開)。
.div
row-reverse：主軸為水平方向，起點在右端
column：主軸為垂直方向，起點在上沿
column-reverse：主軸為垂直方向，起點在下沿
預設情況下，專案都排在一條線（又稱"軸線"）上
flex-wrap 屬性定義，如果一條軸線排不下，如何換行
.div
wrap：換行，第一行在上方
wrap-reverse：換行，第一行在下方
是 flex-direction 屬性和 flex-wrap 屬性的簡寫形式，預設值為 row nowrap
.div
.div
flex-end：右對齊
center： 居中
space-between：兩端對齊，專案之間的間隔都相等
space-around：每個專案兩側的間隔相等。所以，專案之間的間隔比專案與邊框的間隔大一倍
align-items 屬性定義專案在交叉軸上如何對齊
.div
flex-end：交叉軸的終點對齊
center：交叉軸的中點對齊
baseline: 專案的第一行文字的基線對齊
stretch（預設值）：如果專案未設定高度或設為auto，將佔滿整個容器的高度
align-content 屬性定義了多根軸線（多行）在交叉軸上的對齊方式
如果專案只有一根軸線（一行），該屬性不起作用
.div
flex-end：與交叉軸的終點對齊
center：與交叉軸的中點對齊
space-between：與交叉軸兩端對齊，軸線之間的間隔平均分布
space-around：每根軸線兩側的間隔都相等
所以，軸線之間的間隔比軸線與邊框的間隔大一倍
stretch（預設值）：軸線佔滿整個交叉軸
Flex布局 容器屬性（總結）
y豎向x橫向 元素的排列方向 flex direction row 預設樣式，從左到右排列 flex direction row reverse 從右到左排列 flex direction column 從下到上排列 flex direction column reverse 從下到上排列 設定是否...
flex布局基礎入門總結 專案屬性
order 屬性定義專案的排列順序 數值越小，排列越靠前，預設為0 div flex grow 屬性定義專案的放大比例，預設為0，即如果存在剩餘空間，也不放大 如果所有專案的 flex grow 屬性都為1，則它們將等分剩餘空間 如果有的話 如果乙個專案的 flex grow 屬性為2，其他專案都為...
Flex布局 彈性布局 基礎入門
flex是flexble box的縮寫，意為 彈性布局 用來為盒狀模型提供最大的靈活性，任何乙個容器都可以指定為flex布局。採用 flex 布局的元素，稱為 flex 容器 flex container 簡稱 容器 他所有子元素自動成為容器成員，簡稱為 flex 專案 flex item 簡稱 專...