最近專案中更多的用到了flex布局，以前不太會用，記錄一下嘗試過程和心得。
display: flex;（塊標籤）/display:inline-flex;（行內標籤）給某一標籤新增上述樣式後，即可將此標籤設定為flex布局（彈性布局），任何乙個容器都可以被指定為flex 布局；
常用的彈性布局分兩大種，第一種是橫向彈性布局（row），另一種是豎向彈性布局（column），使用的方法是給標籤新增如下樣式：
flex-direction: row/column;注意：如果是webkit核心的瀏覽器，必需加上-webkit字首
display: -webkit-flex;根據圖示理解：
容器（被設定flex的標籤）中所有的專案（子標籤）都沿著主軸排列。
flex-direction決定的是主軸的方向（即專案排列的方向）。
值有row（水平主軸左端為起點）、row-reverse（水平主軸右端為起點）、column（垂直主軸上端為起點）、column-reverse（垂直主軸下端為起點），排列方式如下圖：
/暫時還沒用到，以後再補充/
justify-content——使flex布局內部的子元素
最常用的flex屬性，有三個值，0，1，auto
當你有乙個容器，容器中有三個專案，你希望三個專案平分容器的寬度（高度）時：
給每乙個專案設定——flex: 1當容器中有兩個專案，其中乙個定高，你希望第二個專案的高度自動填充剩下的容器的高時：
給第二個專案設定——flex: 1當容器中有n個專案，需要所有的專案n等分的時：
給所有的專案設定——flex: 1
flex布局學習記錄
推薦阮一峰寫的flex布局部落格,這裡我只是說下自己的學習記錄.flex布局可以實現響應式布局.相容性 實現flex布局,要有父容器和子元素.將父容器設定為display flex.父容器設定為display flex之後，它的子元素的float,clear,vertical align屬性將失效。...
flex布局 Flex布局
摘要 flex布局主要思想是讓容器有能力讓其子專案能夠改變其寬度 高度 甚至順序 以最佳方式填充可用空間 主要是為了適應所有型別的顯示裝置和螢幕大小 作者 星星 flex 是 flexible box 的縮寫，意為 彈性布局 flex布局主要思想是讓容器有能力讓其子專案能夠改變其寬度 高度 甚至順序...
flex布局使用總結
flex是flexible box的縮寫，意為 彈性布局 用來為盒狀模型提供最大的靈活性。任何乙個容器都可以指定為flex布局。flex布局使得乙個框體內部的排版更為便捷，比如柵格排版，自適應分配長寬，垂直居中等，原來可能需要很多樣式配合來完成。flex布局主要由兩層結構實現，外層container...