這一章節(jié)我們來學(xué)習(xí)justify-content屬性，本屬性定義了項目在主軸上的對齊方式。結(jié)合上一節(jié)的布局例子進行理解，屬性值分別為：

 justify-content: flex-start | flex-end | center | space-between | space-around;

flex-start：交叉軸的起點對齊

 .box {
        background: blue;
        display: flex;
        justify-content: flex-start;
    }

實現(xiàn)效果：

flex-end：右對齊

 .box {
        background: blue;
        display: flex;
        justify-content: flex-end;
    }

實現(xiàn)效果：

center： 居中

 .box {
        background: blue;
        display: flex;
        justify-content: center;
    }

實現(xiàn)效果：

space-between：兩端對齊，項目之間的間隔都相等。

 .box {
        background: blue;
        display: flex;
        justify-content: space-between;
    }

實現(xiàn)效果：

space-around：每個項目兩側(cè)的間隔相等。所以，項目之間的間隔比項目與邊框的間隔大一倍。

.box {
        background: blue;
        display: flex;
        justify-content: space-around;
    }

實現(xiàn)效果：