ant-design/components/grid/demo/responsive-more.md
二货机器人 efd3b35830
feat: Col support flex prop (#16635)
* feat: Col support `flex` prop

* update snapshot

* update doc

* row component use flex type by default

* revert grid flex layout doc

* remove float style

* remove doc old FAQ

* revert .make-row

* col style use flex and max-width

* remove useless Col style and imorove base doc for a single Col

* update snapshots

* fix flex mode pseudo

* update snapshots

* back to old flex mode demo gray background color

* set default col flex => 1 auto

* change grid about flex mode description

* update snapshots

* improve grid introduce and fix with gutter bug

* update snapshots

* remove version
2019-11-20 11:13:24 +08:00

36 lines
794 B
Markdown

---
order: 9
title:
zh-CN: 其他属性的响应式
en-US: More responsive
---
## zh-CN
`span` `pull` `push` `offset` `order` 属性可以通过内嵌到 `xs` `sm` `md` `lg` `xl` `xxl` 属性中来使用。
其中 `xs={6}` 相当于 `xs={{ span: 6 }}`
## en-US
`span` `pull` `push` `offset` `order` property can be embedded into `xs` `sm` `md` `lg` `xl` properties to use, where `xs={6}` is equivalent to `xs={{span: 6}}`.
```jsx
import { Row, Col } from 'antd';
ReactDOM.render(
<Row>
<Col xs={{ span: 5, offset: 1 }} lg={{ span: 6, offset: 2 }}>
Col
</Col>
<Col xs={{ span: 11, offset: 1 }} lg={{ span: 6, offset: 2 }}>
Col
</Col>
<Col xs={{ span: 5, offset: 1 }} lg={{ span: 6, offset: 2 }}>
Col
</Col>
</Row>,
mountNode,
);
```