直接给.card加border-radius没效果是因为缺少overflow: hidden，必须同时设置.card { border-radius: 12px; overflow: hidden; }才能裁切溢出内容。
直接给.card加border-radius没效果？缺overflow: hidden
Bootstrap 5 的
默认只设了
，但**不带
**，所以即使你写了
，里面的图片、按钮或文字仍会“溢出”圆角区域，看起来像没生效。这不是 CSS 写错了，是裁剪逻辑缺失。
必须同步设置：
如果卡片用了
或
，这个
必须加在
上，而不是子元素
避免加在
或其他内部容器上——它只裁自己，不影响顶部图
用CSS变量改全局圆角时，.card是否响应？
Bootstrap 5.3+ 中，
的圆角由 CSS 变量
控制，但前提是你的项目加载的是支持该变量的构建版本（如官方 npm 包或 v5.3+ 编译输出）。CDN 引入的旧版 CSS（比如 v5.2.3）可能仍硬编码数值，
覆盖无效。
验证方式：打开浏览器开发者工具，检查
计算后的
值，看是否为
。
立即学习
“
前端免费学习笔记（深入）
”；
安全写法（兼容所有版本）：
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
下载
加
覆盖：
（仅对 v5.3+ 有效）
fallback 直接覆盖：
别只改
就以为万事大吉——某些组件（如
）可能未接入该变量
想让卡片只有顶部圆角？别只靠rounded-top类
类确实能设上边两个角，但它**不会自动禁用下边圆角**——如果
本身已有默认
（比如来自
变量），那底部依然有弧度，结果是“上下都圆”，和预期不符。
正确做法是显式重置：
（推荐，精准控制）
或清除继承：
避免混用：
在 Bootstrap 5 中可能被变量值覆盖，行为不稳定
自定义圆角类（如.rounded-6）和.card冲突怎么办？
你写了
，又给卡片加了
，但发现圆角还是默认值——大概率是加载顺序或优先级问题。
关键点：
确保你的自定义 CSS 文件在
之后加载
的选择器权重和
相同，谁在后面谁生效；若
规则里用了
（某些定制主题会），你的类就失效
最稳方案：
，明确限定作用域
别用
—— 会污染第三方弹窗、图表库等非 Bootstrap 元素
复杂点在于：圆角不是孤立视觉属性，它和
、
、图片的
以及父容器布局强耦合。改一个地方前，先看它实际渲染在哪个盒模型层级上。
.cardborder-radiusoverflow: hidden.card { border-radius: 12px; }.card { border-radius: 12px; overflow: hidden; }.card-img-top.card-img-bottomoverflow: hidden.card.card-body.card--bs-border-radius:root.cardborder-radiusvar(--bs-border-radius):root:root { --bs-border-radius: 12px; }.card { border-radius: 12px !important; }:root.dropdown-menu.rounded-top.cardborder-radius$border-radius.card-top-rounded { border-radius: 12px 12px 0 0; }.card-top-rounded { border-radius: 0; } .card-top-rounded { border-top-left-radius: 12px; border-top-right-radius: 12px; }class="card rounded-top".rounded-6 { border-radius: 12px; }class="card rounded-6"bootstrap.css.rounded-6.card.card!important.card.rounded-6 { border-radius: 12px !important; }* { border-radius: 12px; }overflowbox-sizingobject-fit