1. 程式人生 > >微信小程式樣式Flex Box精通課程-Flex容器的屬性-align-content設定各個行的對齊

微信小程式樣式Flex Box精通課程-Flex容器的屬性-align-content設定各個行的對齊

align-content設定各個行的對齊

align-content 屬性用於修改 flex-wrap 屬性的行為。類似於 align-items,
但它不是設定彈性子元素的對齊,而是設定各個行的對齊

在這裡插入圖片描述

.box { align-items: flex-start | flex-end | center | baseline | stretch; } 

 flex-start:與交叉軸的起點對齊。
 flex-end:與交叉軸的終點對齊。
 center:與交叉軸的中點對齊。
 space-between:與交叉軸兩端對齊,軸線之間的間隔平均分佈。
 space-around:每根軸線兩側的間隔都相等。所以,軸線之間的間隔比軸線與邊框的間隔大一倍。
 stretch(預設值):軸線佔滿整個交叉軸。

歡迎大家收看我的視訊教程:微信小程式介面設計佈局Flex Box精通課程 (微信小程式介面設計必備技能)

在這裡插入圖片描述