flex-direction屬性決定主軸的方向（即專案的排列方向）
屬性:flex-wrap屬性決定是否在一條直線上row（預設值）：主軸為水平方向，起點在左端。
row-reverse：主軸為水平方向，起點在右端。
column：主軸為垂直方向，起點在上沿。
column-reverse：主軸為垂直方向，起點在下沿。
屬性:flex-flow屬性（以上兩種屬性的簡寫）nowrap（預設）：不換行。
wrap：換行，第一行在上方。
wrap-reverse：換行，第一行在下方。
預設值為: row nowrapjustify-content屬性主軸（水平方向）的對齊方式
flex-start 左對齊align-items屬**叉軸(垂直方向)對齊方式flex-end 右對齊
center 居中對齊
space-between 兩端對齊，間隔相等
space-around 間隔相等
flex-start 交叉軸 起點對齊align-content屬性多根軸線的對齊方式flex-end 終點對齊
center 中點對齊
baseline 第一行文字基線對齊
stretch 未設定寬高，佔滿整個容器的高度
flex-start：與交叉軸的起點對齊。flex盒模型tabbar快速布局flex-end：與交叉軸的終點對齊。
center：與交叉軸的中點對齊。
space-between：與交叉軸兩端對齊，軸線之間的間隔平均分布。
space-around：每根軸線兩側的間隔都相等。所以，軸線之間的間隔比軸線與邊框的間隔大一倍。
stretch（預設值）：軸線佔滿整個交叉軸。
父級元素（tabbar）新增屬性display:flex;
justify-content: space-around;
align-items:center;
Flex伸縮盒模型
1.伸縮容器屬性 1.1設定伸縮容器 設定元素為伸縮容器 display flex 設定元素為內聯級伸縮容器 display inline flex。下面的元素會上來。1.2主軸方向 flex direction屬性決定主軸的方向 即專案的排列方向 flex direction row row 預設...
Flex彈性盒模型
flex direction用來控制子項整體布局方向，是從左往右還是從右往左，是從上往下還是從下往上。flex direction row 布局的排列方向 主軸排列方向 row 預設值，顯示為行。方向為當前文件水平流方向，預設情況下是從左往右。row reverse 顯示為行。但方向和row屬性值是...
flex盒模型整理
1.彈性盒子真神奇，專案寬度 指x軸為主軸時的寬度，是y軸為主軸時的高度 大於父盒子也溢不出 x軸為主軸時 了解 y軸為主軸時 y軸為主軸可以看成x軸為主軸的旋轉 寬度 指x軸為主軸時的寬度，y軸為主軸時的高度 大於父盒不溢位，取父盒寬度 因為專案的flex shrink預設值為1，所以當專案寬度大...