antd design在原12柵格系統的基礎上，將整個設計區域進行24等分，Row代表行，Col代表列

通過Row的gutter屬性設置Col與Col之間的間隔，響應式設置 { xs:8,sm:16,md:24,lg:32}

將內容放在Col中，只有Col可以作為Row的直接元素，將每個Row（每行）平均分成24份，在每個Col中通過span={}或響應式進行圈地

如果一個Row中的Col的總和超過24，超出的的Col會作為一個整體另起一行排列

<Row gutter={{ xs:8,sm:16,md:24 }}>

　　<Col sm={12} md={8} lg={6} xl={6}></Col>

　　<Col sm={12} md={8} lg={6} xl={6}></Col>

　　<Col sm={12} md={8} lg={6} xl={6}></Col>

　　<Col sm={12} md={8} lg={6} xl={6}></Col>

</Row>

?

轉載于:https://www.cnblogs.com/luxiaot/p/11251238.html

總結

以上是生活随笔為你收集整理的ant design中的栅格化系统的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。