阮一峰有一篇flex教程很全面：
這裡主要記錄一下需要用到而不常用的知識點：
1.flex-grow屬性
定義專案的放大比例，預設為0，即如果存在剩餘空間，也不放大。
如果所有專案的flex-grow屬性都為1，則它們將等分剩餘空間（如果有的話）。
如果乙個專案的flex-grow屬性為2，其他專案都為1，則前者佔據的剩餘空間將比其他項多一倍。
2.flex-shrink屬性
定義了專案的縮小比例，預設為1，即如果空間不足，該專案將縮小。
如果所有專案的flex-shrink屬性都為1，當空間不足時，都將等比例縮小。
如果乙個專案的flex-shrink屬性為0，其他專案都為1，則空間不足時，前者不縮小。
3.align-self屬性
align-self屬性允許單個專案有與其他專案不一樣的對齊方式，可覆蓋align-items屬性。
預設值為auto，表示繼承父元素的align-items屬性，如果沒有父元素，則等同於stretch。
CSS布局flex布局常用屬性
display flex使用flex布局首先要設定父容器 水平方向 justify content flex start 起始端對齊 justify content flex end 末尾段對齊 justify content center 居中對齊 justify content space ar...
常用開發布局之flex布局 常用屬性
在之前我也寫過一篇flex布局的一篇文章，flex新增屬性。可以看下，剛開始第一次接觸flex布局時寫的，現在看看感覺有一點籠統，不是很清晰。但是裡面解釋了很多基礎知識，還是值得看的。今天再來縷縷常用的父項屬性和子項屬性。上來，裡面有詳細的解釋 flex deriction 控制主軸的正方向 row...
Flex布局常用屬性簡單總結
常用布局方式也就是float，但flex布局更適合移動端專案開發 參考flex布局 1，布局方式 display flex display webkit flex safari a.橫向縱向布局 flex direction row column row reverse row reverse b....