容器需设固定高度（如px/vh/rem）并配overflow-y:auto才能启用局部滚动；flex子项要加flex-shrink:0；scroll事件须绑定在该容器上；优先用scrollto()/scrollby()控制滚动，配合scroll-behavior:smooth实现平滑效果。
容器必须有固定高度 + overflow-y: auto
局部滚动不是加个 overflow-y: auto 就能动的。浏览器只对“明确知道自己多高”的容器启用滚动上下文。如果容器高度靠内容撑开、或只写了 min-height、或父级是 display: flex 但没控收缩，scrollTop 永远是 0，滚动事件也不触发。
正确做法是给容器设 height 或 max-height，单位用 px、vh 或 rem；避免用 %，除非你确认父级高度已计算完毕。
- Flex 子项要加
flex-shrink: 0，否则可能被压缩到无高度 - 别用
overflow: hidden试图“隐藏多余”，它直接禁掉滚动能力 - 移动端 Safari 偶发不显示滚动条，可改用
overflow-y: scroll强制显示
局部滚动事件监听要绑对目标元素
监听局部滚动，必须把 scroll 事件绑定在那个带 overflow-y: auto 的容器上，不是 window，也不是它的父级。常见错误是绑在 window 上还纳闷为什么 container.scrollTop 总是 0。
调试时先运行：console.log(container.scrollHeight, container.clientHeight, container.scrollTop)。如果前两者相等，或 scrollTop 始终为 0，说明根本没形成可滚动空间。
- Vue/React 中用
ref获取容器后，务必等mounted/useEffect执行完、DOM 渲染完成再绑定事件 - 安卓 WebView 和旧版 iOS Safari 对
scroll事件支持不稳定，建议加{ passive: true }选项 - 避免在回调里频繁读
scrollTop——它会强制同步 layout，卡顿明显
用 scrollTo 或 scrollBy 控制滚动位置更可靠
想点击按钮回顶部、或滚到某一项？别手动赋值 container.scrollTop = 0，它不支持平滑，且在高 DPI 屏或缩放页面下容易误判边界。优先用 container.scrollTo() 或 container.scrollBy()。
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
scrollTo({ top: 0, behavior: 'smooth' }) 是现代标准，Chrome/Firefox/Edge 全支持；Safari 15.4+ 支持，旧版降级为 behavior: 'auto' 即可。
-
scrollBy()更适合“点一下滚一段”场景，它是相对位移，不依赖初始状态，重排后依然稳定 - 判断是否到底部不能只写
scrollTop >= scrollHeight - clientHeight，得留小数余量：scrollTop > scrollHeight - clientHeight - 0.5 - 确保调用前检查
container.contains(target)，防止目标不在该容器内却强行滚动
scroll-behavior: smooth 必须设在滚动容器本身
想让局部滚动变丝滑？scroll-behavior: smooth 必须写在那个可滚动的容器上，不是 html 或 body。写错位置就完全无效。
例如：.chat-history { height: 400px; overflow-y: auto; scroll-behavior: smooth; }。这样后续调用 scrollTo() 或 scrollIntoView()（传入该容器）才会平滑。
- IE 完全不支持；iOS Safari 15.4 之前有 bug，
scrollIntoView({ behavior: 'smooth' })在局部容器里可能失效 - 用户开启系统级「减少运动」偏好时，该属性自动失效，这是预期行为，不用绕过
- 如果容器用了
transform或contain: paint，可能隔离滚动上下文，导致属性不生效
实际最容易被忽略的，是容器高度是否真正生效——很多问题表面是滚动不动，根子在渲染完成前，clientHeight 还是 0，或者 Flex 布局中子项被意外压缩。动手前先打开 DevTools，盯着 computed height 和 overflow 看一眼，比调十分钟 JS 更快。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
