父組件為father，子組件為son，擁有的屬性值如下
.father{
display:flex;
flex-direction:flex-direction:row | row-reverse | column | column-reverse; //主軸的方向（即項目的排列方向）
flex-wrap: flex-wrap: nowrap | wrap | wrap-reverse; //如果一條軸線 排不下党涕，如何換行
flex-flow:<flex-direction> || <flex-wrap>;//是flex-direction屬性和flex-wrap屬性的簡寫形式
justify-content:flex-start | flex-end | center | space-between |space-around; //項目在主軸上的對齊方式
align-content:flex-start | flex-end | center | spance-between | space-around |stretch;//交叉軸上如何對齊。
}
.son{
order:<integer>;//定義項目的排列順序返奉。數(shù)值越小尤蒿，排列越靠前，默認(rèn)為0.
flex-grow:<number>;/* default 0*///定義項目的放大比例萍嬉，默認(rèn)值為0乌昔，即如果存在剩余空間，也不放大壤追。
flex-shrink:<number>;/* default 1 *///定義了項目的縮小比例磕道，默認(rèn)為1，即如果空間不足行冰，改項目將縮小
flex-basis: <length> | auto; /* default auto *///定義了在分配多余空間之前溺蕉，項目占據(jù)的主軸空間（main size）。瀏覽器根據(jù)這個屬性疯特，計算主軸是否有多余空間。它的默認(rèn)值為auto贿堰，即項目的本來大小辙芍。
flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]//flex屬性是flex-grow, flex-shrink 和 flex-basis的簡寫，默認(rèn)值為0 1 auto。后兩個屬性可選故硅。
}
