注意，設為 flex 布局以後，子元素的float、clear和vertical-align屬性將失效
1.容器的屬性
flex-direction
flex-wrap
flex-flow:flex-direction flex-wrap
justify-content
aligns-items: 特殊值 baseline | stretch
align-content: 特殊值 stretch
2.專案的屬性
order:0 數值越小，排列越靠前
flex-grow:0 專案的放大比例
flex-shrink:1 專案的縮小比例
flex-basis:auto 定義了在分配多餘空間之前,專案佔據的主軸空間
flex: flex-grow, flex-shrink 和 flex-basis auto (1 1 auto) 和 none (0 0 auto)
align-self: auto 允許單個專案有與其他專案不一樣的對齊方式，可覆蓋align-items屬性 align-self: auto | flex-start | flex-end | center | baseline | stretch;
Flex彈性布局基礎屬性
彈性布局可以簡潔 完整 響應式的實現各種頁面布局。螢幕和瀏覽器視窗大小變化也可以靈活調整布局 指定伸縮元素沿著主軸或者側軸，按照一定比例分配額外的空間，調整伸縮元素的大小 指定伸縮元素沿著主軸或者側軸，把伸縮元素額外空間分配到伸縮元素之前 之後和之間 控制元素在頁面上的布局方向 指定如何將垂直於元素...
Flex彈性布局 屬性總結（一）
傳統布局的核心是盒子模型，依賴display屬性 position屬性 float屬性。可以看出來傳統布局非常容易實現像 word 左對齊，右對齊這樣的功能，可以說，傳統布局更適合於文字排版。但是，對於垂直居中這樣一些布局，以及響應式開發，雖說可以實現，但是卻不夠效率。使用flex布局則有這些優勢 ...
關於彈性布局flex屬性詳解
flex 復合屬性,設定或檢索彈性盒模型物件的子元素如何分配空間。由以下三個屬性組成 flex grow 用來指定擴充套件比例，即剩餘空間是正值時此flex子項相對於flex容器裡其他flex子項能分配到空間比例，在flex屬性中該值如果被省略則預設為1 flex shrink 用來指定收縮比例，即...