flexbox佈局是w3c繼css之後的新的佈局方式，可以簡便、完整、響應式地實現各種頁面佈局。Flex是Flexible Box的縮寫，意為"彈性佈局"，用來為盒狀模型提供最大的靈活性。任何一個容器都可以指定為Flex佈局。
如果你是Android開發者(跟FlowLayout很像)或是前端開發者，相信你會很輕鬆的操縱這種佈局方式。
##首先，我們先來認識一下flexbox佈局的幾個重要屬性
- flexDirection 定義子元素是水平（row）還是豎直（column）排列，預設值為column。
flexDirection: 'row', 使得子元素水平排列
- justifyContent 定義子元素在主軸（x軸）的對齊方式
- flex-start
- flex-end
- center
- space-around -> 兩端對齊，專案之間的間隔相等
- space-between
下面來看下 space-between 的佈局方式
justifyContent: 'space-around',
- alignItems 定義了y軸上子元素的佈局方式
- flex-start
- flex-end
- center
- stretch-> 拉伸至整個容器
- flexWrap flexWrap屬性定義一條軸線排不下時是否折行。它有兩個值，分別是wrap和nowrap，分別代表支援換行和不支援換行，預設是nowrap。
針對於子元素本身的佈局方式
-
flex 是否讓當前的檢視儘量佔用更大的空間，這個屬性可能使專案屬性justifyContent失效。有兩個值0和1，0代表否，1代表是，預設為0。
-
alignSelf 允許單個專案在交叉軸方向上與其他專案不一樣的對齊方式，可覆蓋alignItems屬性，它的值有五個，除了auto，其他都與alignItem屬性完全一致，預設為auto。
不過最後要說的是，這種東西 還是靠自己去玩，才能玩出心得出來。還是一句話：無他 唯手熟爾！！！
說句題外話，我寫文章，她就一直在我旁邊看著