必须给 div 设定明确的 height 或 max-height，否则 overflow 属性不会生效；常见错误是仅设 overflow: auto 却未限制高度，导致容器无限撑高而无法判断是否溢出。
必须给 div 设定明确的 height 或 max-height，否则 overflow 属性不会生效——这是 90% 溢出滚动失效的根源。
为什么设置了 overflow 却没滚动条
常见错误是只写 overflow: auto，但忘了限制容器高度。浏览器无法判断“是否溢出”，因为容器会随内容无限撑高。
-
height或max-height必须是具体值（如200px、50vh），不能是auto或未声明 - 若父容器使用
display: flex，子div可能被拉伸，需额外加flex-shrink: 0或min-height: 0阻断弹性行为 - 内联样式中漏写单位（如
height: 200）会导致无效，必须是height: 200px
vertical-only 滚动该用 overflow-y 还是 overflow
优先用 overflow-y: auto + overflow-x: hidden 组合，避免意外横向滚动干扰体验。
-
overflow: auto在某些旧版 Safari 中可能同时触发横纵滚动，即使内容只超高度 -
overflow-y: scroll会始终显示滚动条（哪怕没溢出），占位固定；overflow-y: auto更节省空间 - 若内容含长单词或连续无空格字符串（如 base64、URL），需加
word-break: break-word或white-space: normal，否则可能强制横向溢出
移动端滚动卡顿或惯性失效
iOS 和部分 Android WebView 默认禁用滚动惯性，需显式启用。
立即学习“前端免费学习笔记（深入）”；
- 加
-webkit-overflow-scrolling: touch（仅 WebKit 内核有效，iOS 必加） - 若容器有
transform、will-change或opacity < 1，可能触发合成层异常，导致滚动卡顿，可尝试加backface-visibility: hidden - 避免在滚动容器内频繁操作 DOM 或触发布局重排（如读取
offsetHeight后立刻修改样式）
最易被忽略的是：当 div 嵌套在 position: absolute/fixed 元素里时，它的 height 计算基准可能丢失，此时必须用 top/bottom 配合 height: auto，或改用 max-height 并确保父级有明确尺寸上下文。
