加 overflow-y: auto 不出现滚动条是因为未设置 max-height 或 height 导致容器未被限高，只有当 scrollheight > clientheight 时才会触发滚动条显示。
直接加 overflow-y: auto 不会出现滚动条，因为容器没被限制高度——必须配 max-height 才能触发溢出和滚动条显示。
为什么加了 overflow-y: auto 还没滚动条
这不是类没生效，是 CSS 触发条件不满足：只有当内容总高度（scrollHeight）大于容器可视高度（clientHeight）时，overflow-y: auto 才会渲染滚动条。常见错误包括：
- 只写
overflow-y: auto，却没设max-height或height，容器随内容无限撑高 - 父容器用了
overflow: hidden，把子级滚动条直接截掉 - 滚动区里有
table或flex子项，它们默认会撑宽容器，导致横向溢出干扰纵向滚动判断
验证是否生效：打开 DevTools → 选中元素 → 查看 Computed 面板里的 scrollHeight 和 clientHeight，确认前者 > 后者。
max-height 怎么写才真正响应式
写死 max-height: 400px 在手机上太高、桌面又太矮；靠 h-75 这类工具类又容易被父容器 padding 干扰，实际可用高度偏差可达 30px。实操建议：
- 主屏用视口计算：
max-height: calc(100vh - 200px)（减去 header/nav 固定高度） - 小屏单独微调：
@media (max-width: 576px) { .scrollable { max-height: calc(100vh - 160px); } } - 在
.modal-body里？直接加内联样式：style="max-height: 70vh; overflow-y: auto;"，别动.modal-dialog - 滚动区内含
<table>？务必加 <code>min-width: 0到 table 外层容器，否则 flex 布局下它会强行撑宽移动端 Safari 滚动条卡顿或不出现
iOS Safari 对
overflow-y: scroll渲染有延迟，尤其内容含图片或动画时。旧版需启用惯性滚动，新版虽已默认支持，但留着更稳：- 给滚动容器加
-webkit-overflow-scrolling: touch - 务必加
style="scroll-behavior: auto;"，禁用smooth（某些安卓 WebView 会白屏或卡死） - 图片加
img-fluid d-block，避免 inline 默认 baseline 对齐挤压滚动区域
阴影/边框和滚动条共存时的裁剪问题
直接给滚动容器加
shadow-sm或border，阴影和边框大概率被裁掉——不是类失效，是overflow: auto的裁剪边界把它们挡在可视区外。- 正确做法：外层容器加
position: relative+z-index: 1+shadow-sm，内层只负责overflow-y: auto和max-height - 边框也一样：加在外层，别加在滚动区本身
- 父容器不能有
overflow: hidden，这是阴影/边框消失最常被忽略的原因 - 深色模式下
shadow-sm几乎不可见，得用自定义box-shadow覆盖
最容易漏的是外层容器的
position: relative和z-index——没它，再精细的滚动逻辑也撑不起视觉层。 - 给滚动容器加
