antd Grid

import { Row, Col } from 'antd';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 : <576pxflex

  sm  : >= 576 pxspa

  md : >= 768pxcode

  lg : >=992px对象

  xl : >=1200pxblog

  xxl : >=1600pxtoken

相关文章
相关标签/搜索