1.控制軸方向的方法
如何方塊堆滿容器大於容器寬度。會自動壓縮
flex-direction決定主軸方向（X軸）
屬性值：4個
1：flex-direction: row 默認主軸從左到右，左起點
2：flex-direction: row-reveres 默認主軸從右向左，右起點
3：flex-direction:column 默認縱軸（Y軸），從上到下
4：flex-direction:column 默認縱軸（Y軸），從下到上
總結：flex-direction 控制軸的四個屬性值
左起 row（因為display：flex默認就是row所以不用吊這個）
右起 row-reverse
上起 column
下起 column-reverse
------------------------------------------------------------美麗的分割線-----------------------------------------------------------------------------
2.控制換行的方法
flex-wrap 方法 如下三個值
1.flex-weap：nowrap 不換行 下圖方塊都擠一起去了，默認不換行，寫不寫都行
2.flex-weap: 換行 地球通用換行，擠不下就下去，從左到右排
4.flex-weap:wrap-reverse 向上換行排列
flex-flow：row nowrap 簡寫，從左到右不換行
--------------------------------------------------美麗的分割線-------------------------------------------
3.元素在主軸的對齊方式
justify-content:flex-end; 右對齊
注意！剛學的同學可能分不清這個和flex-direction：row-reverse和justify-content：end區別在哪。看下圖！flex-direction：row-reverse是1在最右
居中對齊justify-content：center
兩端對齊
justify-content:space-around：每個項目兩側的間隔相等。所以，項目之間的間隔比項目與邊框的間隔大一倍。
