直接覆盖 .navbar 的 border-radius 才有效，因其圆角写死在 css 规则中且不响应 rounded-0；需同时覆盖 .navbar、.dropdown-menu、.navbar-toggler、.form-control 等子组件并加 !important，或通过 sass 重定义 $border-radius-lg 变量实现全局统一。
直接覆盖 .navbar 的 border-radius 才有效
Bootstrap 5 的 .navbar 圆角是写死在 CSS 规则里的：.navbar { border-radius: 0.5rem; }，它不响应 rounded-0 类——因为 rounded-0 只对显式加了 rounded 类的元素起作用，而导航栏压根没用那个机制。
常见错误现象：
- 给
<nav class="navbar"></nav>加rounded-0，圆角纹丝不动 - 只覆盖
.navbar，但点击下拉菜单或聚焦输入框时，.dropdown-menu或.form-control仍带圆角，视觉割裂 - 没加
!important，被 Bootstrap 后续规则（如.navbar:focus或主题变体）覆盖
必须同时处理 .navbar 和它的子组件
.navbar 本身只是容器，真正露出来的圆角常来自内部组件：
-
.navbar-brand一般没问题，但若用了.btn做品牌链接，得额外加.btn { border-radius: 0 !important; } -
.navbar-nav > .nav-link默认无圆角，但若用.btn替代链接，就得覆盖.btn -
.navbar-toggler（汉堡按钮）有独立圆角，需单独设.navbar-toggler { border-radius: 0 !important; } - 如果导航栏里嵌了搜索框（
.form-control或.input-group），必须一并覆盖：.form-control, .input-group > * { border-radius: 0 !important; }
别漏掉 .dropdown-menu 和深色模式
下拉菜单默认挂在 .navbar 下，它的圆角是独立声明的：.dropdown-menu { border-radius: 0.375rem; }。即使 .navbar 直角了，弹出菜单还是圆的。
另外，如果你项目启用了深色模式（data-bs-theme="dark"），.navbar 在不同主题下可能有不同圆角值，建议统一覆盖：
- 全局方案：
.navbar, .dropdown-menu { border-radius: 0 !important; } - 若只想改默认主题，可限定 scope：
:root:not([data-bs-theme="dark"]) .navbar, :root:not([data-bs-theme="dark"]) .dropdown-menu { border-radius: 0 !important; }
用 Sass 重定义变量是最干净的长期方案
如果你的项目已接入 Sass 编译（如 Webpack + sass-loader），直接改源变量比写一堆 !important 更可靠：
- 在自定义 SCSS 入口顶部重定义：
$border-radius: 0;、$border-radius-lg: 0;（.navbar用的是lg级） - 确保在导入 Bootstrap 变量前设置，顺序不能错：
@import "bootstrap/scss/functions"; @import "bootstrap/scss/variables";之前就定义好 - 这样所有依赖
$border-radius-lg的组件（包括.navbar、.dropdown-menu、.btn-lg）都会同步生效，无需手动补漏
CDN 项目没 Sass 环境，就老实用 CSS 覆盖；但要注意 .navbar 的圆角只是冰山一角，真正难搞的是它和周边组件的圆角协同——漏掉任何一个，视觉上就“断层”了。
