css3新屬性partC

這一章咱們繼續講flex佈局：
咱們上一章講了主軸和輔軸，咱們這一章繼續講一下flex佈局的佈局方式：
3.justify-content屬性
這個屬性規定了模塊在主軸上的對齊方式
它的可選項有如下幾種：
justify-content: flex-start（左對齊，這個是默認屬性） | flex-end（右對齊） | center（居中） | space-between （兩端對其，每一個之間均勻分佈）|space-around（每一個項目兩側的間隔相等。因此，項目之間的間隔比項目與邊框的間隔大一倍）;
咱們用代碼試一下：
flex-start：

flex-end:

center

space-between:

space-around:

4.align-items:
該屬性定義項目在交叉軸（輔軸）上如何對齊：
align-items: flex-start（默認選項，交叉軸的起點對齊） | flex-end（交叉軸的終點對齊） | center（交叉軸的中點對齊） | baseline（項目的第一行文字的基線對齊） | stretch（若是項目未設置高度或設爲auto，將佔滿整個容器的高度）
flex-start就是默認項，咱們這裏就不展現了
flex-end:

center:

baseline:

不設置baseline的效果：

設置了的效果：

stretch：

stretch須要取消被排版模塊的高度 從這裏flex佈局告一段落，下一part咱們要講一下css3帶來的新的樣式