align-items屬性定義項(xiàng)目在交叉軸上如何對(duì)齊。

align-items: flex-start | flex-end | center | baseline | stretch;

flex-start：交叉軸的起點(diǎn)對(duì)齊。

flex-end：交叉軸的終點(diǎn)對(duì)齊。

center：交叉軸的中點(diǎn)對(duì)齊。

baseline: 項(xiàng)目的第一行文字的基線對(duì)齊。

stretch（默認(rèn)值）：如果項(xiàng)目未設(shè)置高度或設(shè)為auto，將占滿整個(gè)容器的高度

align-content屬性定義了多根軸線的對(duì)齊方式。如果項(xiàng)目只有一根軸線，該屬性不起作用。

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

flex-start：與交叉軸的起點(diǎn)對(duì)齊。

flex-end：與交叉軸的終點(diǎn)對(duì)齊。

center：與交叉軸的中點(diǎn)對(duì)齊。

space-between：與交叉軸兩端對(duì)齊，軸線之間的間隔平均分布。

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

stretch（默認(rèn)值）：軸線占滿整個(gè)交叉軸。

align-content 屬性在當(dāng)靈活容器內(nèi)的各項(xiàng)沒有占用交叉軸上所有可用的空間時(shí)對(duì)齊容器內(nèi)的各項(xiàng)（垂直）。

center 項(xiàng)目位于容器的中心。 ? ?

align-items 屬性規(guī)定靈活容器內(nèi)的各項(xiàng)的默認(rèn)對(duì)齊方式。

提示：使用每個(gè)項(xiàng)目的 align-self 屬性可重寫 align-items 實(shí)現(xiàn)。

center 項(xiàng)目位于容器的中心。 ? ?