flex: flex-grow flex-shrink flex-basis
- flex-grow 定義項目的放大比例效床，默認為0，即如果存在剩余空間权谁，也不放大
- flex-shrink 定義了項目的縮小比例剩檀，默認為1，即如果空間不足旺芽，該項目將縮小
- flex-basis給上面兩個屬性分配多余空間之前, 計算項目是否有多余空間, 默認值為 auto, 即項目本身的大小
flex : 1 === flex: 1 1 0
元素定寬沪猴，不可伸縮 即
flex: none目測等同于：flex: 1 0 auto（第3點， 可超出采章，不可壓縮）
flex: 0 0 auto不可超出运嗜，但可壓縮 flex 初始值即
flex: initial。 如果子項都是flex: initial悯舟，父元素BOX寬度400洗出， a寬度60，b寬度100, c沒有設(shè)置寬度图谷，如果c的內(nèi)容特別寬，比如500阱洪，則會壓縮a便贵、b的寬度。
flex: 0 1 auto可超出冗荸，不可壓縮. 如果子項都是
flex:1 0 auto承璃，父元素BOX寬度400， a寬度60蚌本，b寬度100, c沒有設(shè)置寬度盔粹，如果c的內(nèi)容特別寬，比如500程癌，則a舷嗡，b寬度不變，c寬度會盡可能地寬嵌莉。
flex: 1 0 auto不可超出进萄， 即
flex : auto。 如果子項都有寬度，會根據(jù)子項寬度比分配空間中鼠。如果只是某些子項有寬度可婶，會優(yōu)先展示沒有設(shè)置寬度的子項，剩余空間再根據(jù)子項的寬度比來分配援雇。
flex: 1 1 auto
- flex 內(nèi)容一行上下居中矛渴，文字居左
.f-flvc {
display:flex;
align-content:center;
align-items:center;
}
- flex 內(nèi)容多行居中排版，需要定高
.f-fvc{
display:flex;
justify-content:center;
flex-direction:column;
-webkit-box-pack:center;
-webkit-box-orient:vertical;
-webkit-box-direction:vertical;
}
