如何消除HTML中的左右边距？已尝试p-0但问题仍存在

• 你代码里的容器类名写错了：Bootstrap的全屏容器是**container-fluid**（连写形式），分开写container fluid不会生效，这是导致p-0没起作用的核心原因之一。
• Navbar组件本身默认带有内边距，内部嵌套的container-fluid也有默认的左右内边距，需要针对性处理：

修正后的代码示例 #

<div class="container-fluid p-0">
  <!-- First child -->
  <nav class="navbar navbar-expand-lg navbar-light bg-info p-0">
    <!-- 若不需要内部容器的布局，可直接移除内部的container-fluid -->
    <img src="./images/1.png" alt="Logo" class="logo">
    <!-- 其他导航栏内容 -->
  </nav>
</div>

若仍有残留间距，可添加自定义CSS强制覆盖 #

/* 消除Navbar的内外边距 */
.navbar {
  margin: 0 !important;
  padding: 0 !important;
}

/* 消除内部容器的内边距（如果保留了内部container-fluid） */
.navbar .container-fluid {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

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