1.flex-direction:決定主軸方向

row:主軸為水平方向。排列為從左至右。

column:主軸為豎直方向。排列為從上至下。

row-reverse:主軸為水平方向。排列為從右至左。

column-reverse:主軸為豎直方向。排列為從下至上。

2.flex-wrap:預設情況，排列在一條線上，即主軸上，flex-wrap決定當排列不下時是否換行以及換行的方式

nowrap:自動縮小專案，不換行。

wrap:換行，第一行在上。

wrap-reverse:換行，第一行在下。

3.justify-content 決定子元素在主軸上的對齊方式

flex-start:左對齊。

flex-end:右對齊。

space-betwenn:兩端對齊。

space-around:沿軸線均勻分佈。

4.align-items 決定子元素在交叉軸的對其方式

flex-start:頂端對齊。

flex-end:底部對齊。

center:豎直方向居中對齊。

stretch:如子元素未設定高度，子元素將和容器等高對齊。

5.align-content 該屬性定義了當有多根主軸時，即子元素不止一行時，多行在交叉軸軸上的對齊方式。注意當有多行時，定義了align-content後，align-items屬性將失效

flex-start：左對齊。

flex-end：右對齊。

center：居中對齊。

space- between：兩端對齊。

space-around：沿軸線均勻分佈。

stretch：各行將根據其flex-grow值伸展以充分佔據剩餘空間。

 5.flex-grow

定義了當flex容器有多餘空間時，子元素是否放大。預設值為0，即當有多餘空間時也不放大；可能的值為整數，表示不同的子元素的放大比例。