antd Grid


import { Row, Col } from 'antd';

<Row
    type="flex" //內容布局(左靠齊,右靠齊,居中)
    justify="start" //左靠齊 (start,center,end,space-between,space-around)
    align = "top" //flex布局下垂直對齊方式:top(默認),moddle,bottom
    gutter = number/object    //柵格間隔,可以寫成像素值或支持響應式的對象寫法 { xs: 8, sm: 16, md: 24}
>
     <Col
         span={8}   //每行24列,這里占8列
         offset={8}    //向右偏移8列
         push={6}    //向右偏移6列
         pull={2}      //向左偏移2列
         xs={2}       //類似boostrop ,小屏幕占兩列
         order = 1    //柵格順序,flex 布局模式下有效
    >col-12 </Col>
</Row>    

1. 

  xs : <576px

  sm  : >= 576 px

  md : >= 768px

  lg : >=992px

  xl : >=1200px

  xxl : >=1600px


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM