給容器設(shè)置
任何容器都設(shè)置 inline-flex 場景幾乎沒有 （行級）
子元素 浮動
display : flex; 使其變成彈性和模型
flex-direction 定義彈性盒模型的主軸方向
row 默認(rèn) 主軸X方向
row-reverse 定義主軸為X 從右向左排列
column 改變主軸方向為豎直 順序從上到下
column-reverse 改變主軸方向為豎直 豎直方向從下到上怕列
justify-content 定義對齊
flex-start 默認(rèn)值 從主軸的啟示對齊
flex-end 從主軸的末尾對齊
flex-center 中間對齊
space-between 定義元素平均分配在主軸上 第一個在開始最后一個在末尾 其他均勻分布
space-around 定義內(nèi)容元素平均分配在主軸上 兩側(cè)的間距是中間的一半

flex-warp
no-warp 默認(rèn)值 不換行
warp 在開始的地方開始 一行放不下自動換行
warp-reserve 在結(jié)束的地方開始

align-items 定義元素交叉軸上的位置
stretch 不設(shè)置交叉軸方向的長度是自動鋪滿交叉軸
baseline 以文字的基線對齊

align-content 交叉抽多行控制方式
屬性值和justify-content一樣
flex-flow ；兩個值 是flex-direction：；和 flex-warp：；的縮寫 兩個屬性之間用空格
以上是伸縮容器設(shè)置的屬性

  伸縮項設(shè)置的屬性
  order：； 順序
            誰的數(shù)值大誰在后邊默認(rèn)值是0；可以用負(fù)數(shù)讓一個元素快速的提升到前面

flex-grow ：；伸縮項目的放大比例 默認(rèn)值是0 存在剩余空間也不放大 值為一的時候自適應(yīng) 平均分配剩余空間
如果想提高某一個元素的大小，可通過改變其權(quán)重來改變（權(quán)重即數(shù)值大?。?br> flex-shrink : ； 伸縮項的縮小比例 默認(rèn)值是 1 伸縮項的大于容器的時候 所有伸縮項共同縮小相同的尺寸達(dá)到自適應(yīng)效果 如果想打破平衡也可以通過改變權(quán)重 權(quán)重越大縮小比例越大
值為0的時候會撐破容器
flex-basis 項目占據(jù)主軸空間 默認(rèn)值是auto （由內(nèi)容撐開）

flex ：；三個屬性的集合（flex-grow flex-shrink flex-basic）
默認(rèn)值 flex：0 1 auto；

align-self：；允許單個項目有與其他項目不一樣的對齊方式，可覆蓋align-items屬性。默認(rèn)值為auto，表示繼承父元素的align-items屬性，如果沒有父元素，則等同于stretch。

標(biāo)注：可以給容器設(shè)置padding，也可以給元素設(shè)置margin調(diào)整一行中元素的個數(shù)