bootstrap 5 中卡片等高必须用 flex 或 grid 实现，min-height 无效且 card-group 已废弃；推荐 row+col+h-100 或 d-grid+h-100 方案，且等高仅限同一父容器内。
Bootstrap 5 默认不启用卡片等高布局，min-height 单独设置无效——它只限制最小高度，不触发 flex 或 grid 的等高对齐逻辑。
card-group 已被移除，别再依赖它
Bootstrap 4 中的 .card-group 类在 v5 中彻底废弃，文档里已无此组件。如果你还在 HTML 里写 <div class="card-group">，它不会产生任何等高效果，CSS 也不再为此类名提供样式支持。<ul>
<li>替代方案必须显式使用 <code>display: flex 容器（如 .row + .col）或 display: grid
.row 默认是 flex 容器，子项（.col）会自动拉伸高度对齐，但前提是卡片本身不设 height 或 position: absolute 等破坏流式的行为<div class="d-flex"> 包裹卡片，需手动加 <code>flex-wrap: wrap 和子项 flex: 1 才能模拟栅格行为卡片内部内容撑不开高度？检查 padding/margin 和 box-sizing
常见现象：卡片设置了 min-height: 300px，但视觉上仍参差不齐。根本原因常是子元素外边距塌陷、内边距溢出，或 box-sizing 不一致。
- Bootstrap 5 默认启用
box-sizing: border-box，但如果自定义 CSS 覆盖了该规则（比如重置了* { box-sizing: content-box }），卡片高度计算就会出错 -
.card-body默认有padding，若内部文字过短且未设height，卡片实际高度 =min-height+padding+ 边框 —— 这没问题；但若内部有margin-bottom: auto或position: absolute元素，可能脱离文档流，导致父卡片无法感知内容高度 - 验证方法：浏览器开发者工具中选中卡片 → 查看 Computed 面板里的
height和min-height是否生效，以及box-sizing值是否为border-box
真正起效的等高方案只有两种：flex 或 grid
靠 min-height 永远做不到“所有卡片严格同高”，必须让容器控制子项对齐行为。
- 推荐用
<div class="row g-3"><div class="col-md-4"><div class="card">…</div></div></div>：.row 是 flex 容器，.col 自动设flex: 0 0 auto，但卡片高度由内容决定；要强制等高，需给 .col 加h-100，再给 .card 加h-100 - 更简洁的是直接用
display: grid：<div class="d-grid gap-3" style="grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)));"><div class="card h-100">…</div></div>——h-100让卡片占满网格单元高度，真正等高 - 切记：只要卡片上没加
h-100，即使父容器是 flex/grid，卡片本身也不会拉伸；min-height只是底线，不是指令
最易忽略的一点：等高只在相同父容器下生效。跨不同 .row 或不同 .d-flex 的卡片，彼此之间毫无高度关联 —— 别指望全局统一，得逐组控制。
