photo.jpg
FLEX布局
一種新的布局方式宇整，flex布局
- flex布局與方向無關(guān)
- flex布局可以實(shí)現(xiàn)空間自動(dòng)分配、自動(dòng)對齊铐姚。
- flex適用于簡單的線性布局彭谁。
flex container:
| 屬性 | 作用 |
|---|---|
| flex-direction | 方向 |
| flex-wrap | 換行 |
| flex-flow | 上面兩個(gè)簡寫 |
| justify-content | 主軸方向?qū)R方式 （center，space-between共虑，space-around愧怜，flex-end，flex-start） |
| align-items | 側(cè)軸對齊方式 （strech妈拌，flex-start拥坛，flex-end，center ） |
| align-content | 多行尘分、列內(nèi)容對齊方式 |
flex item:
| 屬性 | 作用 |
|---|---|
| flex-grow | 增長比例 |
| flex-shrink | 收縮比例 |
| flex-basis | 默認(rèn)大小 |
| flex | 上面三個(gè)縮寫 |
| order | 順序（代替雙飛翼） |
| slign-self | 自身的對齊方式 |
