1.彈性布局
1>flex-direction屬性
決定主軸的方向 flex-direction: row | row-reverse | column | column-reverse;
2>flex-wrap屬性 可用來換行
flex-wrap: nowrap | wrap | wrap-reverse;
3>justify-content屬性 項目在主軸上的對齊方式
box {justify-content: flex-start | flex-end | center | space-between | space-around;}
4>align-items屬性 項目在交叉軸上如何對齊
align-items: flex-start | flex-end |center | baseline | stretch;
5>align-content屬性 多根軸線的對齊方式
align-content: flex-start | flex-end |center | space-between | space-around | stretch;
6>order: <integer>屬性定義項目的排列順序 數值越小，排列越靠前，默認為0
7>flex-grow屬性 項目的放大比例，默認為0
flex-grow: <number>; /* default 0 */
8>flex-shrink屬性 項目的縮小比例
flex-shrink: <number>; /* default 1 */
遠近互聯前端小華整理發布，希望能對學習技術的你有所幫助
遠近互聯專業提供網站建設、APP開發、網站優化、外貿網站SEO、微信運營的品牌整合營銷服務讓客戶通過網絡品牌建立與網絡傳播提高業績。
