bootstrap中row默认不等高并非bug，而是因align-items:stretch仅对直接子元素（col）生效且依赖父容器有可计算高度基准；需确保row为flex容器、col为直接子元素、无overflow/height截断，并显式加align-items-stretch类及逐层h-100配合min-height提供高度上下文。
row 默认不等高，不是 bug，而是 flex 布局的自然行为——align-items: stretch 只对直接子元素（即 col）生效，且依赖父容器有可计算的高度基准；没内容的 col 不会凭空拉高，必须显式提供高度上下文或逐层激活拉伸链。
为什么加了 row 还是不等高
常见原因不是没写对类名，而是底层渲染条件缺失：
-
row的最终display值被覆盖（比如自定义 CSS 或第三方库写了display: block），用开发者工具看 computed 样式确认是否真为flex -
col不是row的直接子元素（例如嵌套了额外的div或内层row），导致stretch失效 -
row父容器设了overflow: hidden、max-height或height，截断了 flex 高度计算 - Bootstrap 4 用户忘了加
d-flex类（row默认仍是block）
align-items-stretch 必须显式加吗
Bootstrap 5 中 row 默认 align-items: stretch，但很多项目实际运行中会被重置或覆盖。最稳妥做法是显式加上 align-items-stretch 类：
<div class="row align-items-stretch"> <div class="col-md-6">短内容</div> <div class="col-md-6">很长的内容……</div> </div>
不要依赖“默认”，尤其当项目用了 Tailwind、自定义 reset.css 或旧版 Bootstrap 混合加载时。align-items: normal 或 flex-start 会直接关闭等高。
h-100 加在哪一层才真正起作用
h-100 不是加在 col 上就完事——它只表示“占满父高”，而父高必须存在。典型失效链：row（无高度）→ col（h-100 无效）→ card（仍按内容高）。
- 若要卡片等高，
h-100必须加在card上，且它的直接父元素（即col）需有可继承的高度 - 给
col加h-100前，确保row有最小高度来源：比如min-height: 300px，或视口级用min-vh-100（比vh-100更安全，防 Safari 地址栏缩放跳变） - 如果
col内部还要底部对齐按钮，需额外加d-flex flex-column到col，再给按钮加mt-auto
图片和长文本怎么避免破坏等高视觉
等高失效的表象，90% 来自内容溢出而非 flex 失效：
- 别给
card-img-top设固定height，改用min-height: 180px+object-fit: cover，保比例不拉伸 - 长单词或 URL 用
word-break: break-word包裹（加在p或div上），否则单行撑宽导致换行错乱、列高异常 - 避免在
col上写style="height: 100%"——百分比高度依赖父元素有显式高度，而row默认没有 - 如果只是想让底部按钮对齐，不用整列等高，改用
align-self-end加在特定col上更轻量
真正卡住人的，从来不是“怎么写”，而是哪一层漏了高度上下文、哪一环被响应式媒体查询悄悄关掉了 stretch——调试时先盯死 row 的 computed display 和 align-items，再查 col 的父高是否可继承。
