Row <Row><Col lg=‘3’></Col></Col>删除默认填充- remove
Row <Row><Col lg=‘3’></Col></Col>删除默认填充- remove
提问于 2021-07-07 11:20:13
在一个react应用程序中，我想从每一列的左边和右边移除填充。我猜这个15 as的填充是由react引导给每一列的，因为我看到的是：
padding-right: 15px;
padding-left: 15px;这是不可移动的(我试图这样做，但失败了)。我在页面上的图片如下所示：
注意：显示颜色的绿色是从左边和右边填充到我想删除的每一列上。
我想要的页面图像输出如下所示：
我的代码：
.js文件
import React from 'react'
import './style.scss';
import { Row, Col } from 'react-bootstrap'
import { Images } from '../../../../Shared/Assets';
import ImagesIcon from '../../../../Components/Cells/ImagesIcon'
const ImgGallery = () => {
return (
<>
<div className='ImgGalry'>
<Row>
<Col lg='3'>
<ImagesIcon src={Images.xgallery4} />
</Col>
<Col lg='3'>
<ImagesIcon src={Images.xgallery2} />
</Col>
<Col lg='3'>
<ImagesIcon src={Images.xgallery1} />
</Col>
<Col lg='3'>
<ImagesIcon src={Images.xgallery2} />
</Col>
</Row>
</div>
</>
);
}
export default ImgGallery;.scss文件
.ImgGalry{
overflow: hidden;
background-color: #01FF56;
img{
width: 100% !important;
height: 100% !important;
}
}对于所有人来说，当使用react引导创建列时，是否有可能删除或隐藏列的填充？谢谢。
回答 1
Stack Overflow用户
发布于 2021-07-07 11:46:21
将px-0类添加到col中。
<Row className="no-gutters">
<Col lg='3' className="px-0">
<ImagesIcon src={Images.xgallery4} />
</Col>
<Col lg='3' className="px-0">
<ImagesIcon src={Images.xgallery2} />
</Col>
<Col lg='3' className="px-0">
<ImagesIcon src={Images.xgallery1} />
</Col>
<Col lg='3' className="px-0">
<ImagesIcon src={Images.xgallery2} />
</Col>
</Row>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68285035
复制相关文章
相似问题
腾讯云开发者
