常見的布局有哪些沟优？
1.最常見布局 ? ?浮動、定位
2.自適應布局 ? ?百分比布局
3.響應式布局 ? ?@media媒體查詢
4.彈性布局 ? ? ? ?display:flex ?將對象最為彈性伸縮盒子顯示 (適用于父類容器元素上)
Flex是Flexible Box的簡稱兵多，意為彈性布局，顧名思義糖声，在網(wǎng)頁布局時抽莱，他可以給我們提供更多的靈活性。
display 彈性布局版本
display:box ? ? ? ?（伸縮盒老版本） ? ? ?2009版
display:flexbox（伸縮盒過渡版本） ??2011版
display:flex?(伸縮盒新版本)2013版
1.flex是display的一個屬性值纸型。與之相當應的還有一個是inline-flex拇砰。
2.設置了Flex布局后梅忌，子元素的float，clear除破，還有verticle-align屬性都不起作用牧氮。
3.設置了display:flex屬性的元素，稱為Flex容器瑰枫，他里面的所有子元素統(tǒng)稱為容器成員踱葛，稱為Flex項目，設置或檢索伸縮盒對象的子元素如何分配空間光坝。
父級：display:flex;
子級：flex1; flex1.2; flex2;?(子級可為小數(shù)和自然整數(shù))
justify-content: flex-start | flex-end | center | space-between | space-around;
屬性定義了Flex項目在主軸方向上的對齊方式
屬性 / 值詳細說明
flex-start ? ? ?類似于左浮動（float：left)
flex-end ? ? ? 類似于右浮動（float:right）
center ? ? ? ? ?Flex項居中
space-between ? ?兩端對齊容器尸诽，各個Flex項目之間的間距相等
space-around ? ? ?每一個Flex項目兩側(cè)的間隔相等
align-items:center (在 display:flex; 屬性后加該屬性嫉晶，可使子元素垂直居中)
參考地址：
http://justcode.ikeepstudying.com/2015/10/css3-flex-彈性布局用法詳解/
