flex-direction屬性:設置子元素的排列方式，同時設置主軸，默認的情況下x軸為主軸 flex-direction: row | column | row-reverse | column-reverse row:設置子元素為x軸正向排列（默認）此時主軸為x軸，側軸為y軸 row-reverse：設置子元素為x軸從右往左排列 此時主軸為x軸，側軸為y軸 column：設置子元素為y 軸正向排列 ，當設置了這個屬性后，主軸變成y軸，側軸變成x軸 column-reverse：設置子元素為y 軸反向排列 ，當設置了這個屬性后，主軸變成y軸，側軸變成x軸 注意：主軸的方向並不是不變的，它是相對於這個屬性而變化 justify-content屬性:設置主軸的排列方式，此屬性作用於父元素上 justify-content: center | flex-start | flex-end | space-around | between-around space-around:子元素平均分布於父元素的主軸上 between-around：首位兩個子元素貼着父元素的邊，其余的子元素平均分布 align-items屬性:設置側軸的排列方式，此屬性作用於父元素上 align-items: center | flex-start | flex-end | space-around | between-around space-around:子元素平均分布於父元素的主軸上 between-around：首位兩個子元素貼着父元素的邊，其余的子元素平均分布 align-self屬性:彈性子元素的屬性，用於設置彈性元素自身在側軸（縱軸）方向上的對齊方式。 align-content: center | flex-start | flex-end | space-around | between-around space-around:子元素平均分布於父元素的主軸上 between-around：首位兩個子元素貼着父元素的邊，其余的子元素平均分布 flex-wrap屬性:當多個子元素的寬超過父元素時，設置是否換行 flex-wrap: wrap | no-wrap | wrap-reverse(反轉)