直接覆盖 .form-control { border-radius: 4px; } 常无效，因 bootstrap 5 的圆角分散在 .form-control、.form-control:focus、.input-group > .form-control、.form-floating > .form-control 等多处规则中，仅改一处会被高权重状态或嵌套规则覆盖，导致点击变直角、左右不一致或 form-floating 下视觉遮挡。
Bootstrap 表单输入框的圆角不是靠开关或配置项控制，而是由 CSS 的 border-radius 决定；默认值是 0.375rem（6px），但直接覆盖 .form-control 常因选择器权重不足或状态规则干扰而失效。
为什么直接写 .form-control { border-radius: 4px; } 经常没反应
因为 Bootstrap 5 的圆角声明分散在多个地方：.form-control、.form-control:focus、.input-group > .form-control、甚至 .form-floating > .form-control 都各自写了 border-radius。只改基础类，:focus 态一触发就变回原样。
- 用浏览器 DevTools 的「Computed」面板查最终生效的
border-radius来源，别猜 - 必须成套覆盖：
.form-control, .form-control:focus, .input-group > .form-control, .input-group > *:first-child, .input-group > *:last-child - 如果用了
form-floating，容器默认overflow: hidden，可能裁掉你设的圆角——得同步给.form-floating加border-radius和overflow: visible - Safari 对
input[type="search"]有私有样式，需加-webkit-appearance: none才能真正接管
form-control-lg 和 form-control-sm 会影响圆角大小吗
不会。这两个类只调整 padding 和 font-size，不修改 border-radius —— 它们完全继承自 .form-control 的值。
- 想让大号输入框圆角更大？得单独加规则：
.form-control-lg { border-radius: 0.5rem; } - 小号输入框同理，但注意
0.125rem（2px）在高缩放或移动端 Safari 下可能视觉不可见，建议用整数像素如4px或8px -
input[type="file"]不走.form-control样式，需单独处理：input[type="file"]::file-selector-button和input[type="file"]本身要分别设圆角
如何安全地全局统一修改表单圆角
取决于你是否控制构建流程：用 Sass 编译时改变量最干净；只引 CDN 时，CSS 覆盖是唯一办法，但要注意变量作用域和加载顺序。
- 如果你用 Webpack/Vite + Sass：在自定义主题文件里改
$input-border-radius（v5.3+ 才生效），它独立于$border-radius，不影响按钮或卡片 - 只引官方 CSS：确保你的自定义 CSS 在 Bootstrap 之后加载，并用足够权重的选择器，比如
.my-form .form-control比单纯.form-control更可靠 - 别指望
--bs-border-radius控制表单——v5.3+ 新增了--bs-input-border-radius，但它只在你引入的 CSS 版本 ≥5.3 且明确启用了 CSS 变量支持时才起作用 - 避免混用工具类（如
rounded-2）和自定义border-radius，容易冲突；真要临时覆盖，用.form-control.rounded-custom这种组合类更可控
最容易被忽略的是伪元素和容器溢出：哪怕 border-radius 正确写入了，form-floating 的包裹容器、input[type="file"] 的按钮结构、或是 Safari 的私有渲染，都可能让圆角“看起来没生效”。先看 Computed，再动手改。
