如何解决React-bootstrap,行和列,如何在移动设备上使列堆叠?
function App() {
return (
<div>
<Container>
<Row>
<Col>
Stuff1
</Col>
<Col>
Stuff2
</Col>
</Row>
</Container>
</div>
);
}
因此,在桌面屏幕上,我得到了两列,分别是Stuff1和Stuff2。
但是,在移动设备上,我不需要两列,因为它看起来非常紧凑。相反,我希望这两列像行一样彼此堆叠。如何实现?
解决方法
您应该通过引导程序查看grid system并在react-strap中使用respective syntax
演示代码:
function App() {
return (
<div>
<Container>
<Row>
<Col sm={6}>
Stuff1
</Col>
<Col sm={6}>
Stuff2
</Col>
</Row>
</Container>
</div>
);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。