如何移除Bootstrap中container-fluid容器的边距？

Bootstrap的container-fluid默认带有左右内边距，再加上浏览器默认给body元素设置了外边距，这两个因素导致你的灰色背景容器出现了边距，按以下方式修改即可解决：

• 给container-fluid添加px-0类，直接移除它的左右内边距
• 清除body的默认外边距，在你的样式代码里添加：

body {
  margin: 0;
}

修改后的完整容器代码如下：

<div class="container-fluid bg-image w-100 px-0" style="background:rgb(201, 188, 188);">
    <div class="text-center display-3 pt-5">
        <p>What We Do</p>
    </div>
    <p class="text-center pt-2" style="padding-right:20%; padding-left: 20%;">Lorem ipsum dolor sit amet consectetur 
        adipisicing elit. A veniam totam eaque praesentium excepturi voluptas suscipit dicta, 
        blanditiis repudiandae error! Quia dignissimos obcaecati vero illum optio ducimus 
        iure assumenda earum hic soluta ratione voluptas laudantium quasi incidunt maxime, 
        autem vel repellendus enim. Maiores enim assumenda fugiat dicta distinctio, a neque.</p>
    <div class="text-center pt-2 pb-2"><img src="./img/03.png" alt="" style="width: 50%;"></div>
    <p class="text-center pt-5 pb-5">Images from <span style="text-decoration: underline">Freepik</span></p>
</div>

内容的提问来源于stack exchange，提问作者Chelovek 01