局部滚动必须满足容器有固定尺寸和显式启用溢出滚动两个硬性前提；仅设overflow-y: auto而未设height或max-height会导致容器被内容撑开，无法触发滚动上下文。
局部滚动必须满足两个硬性前提：容器有固定尺寸 + 显式启用溢出滚动。缺一不可，否则 scroll-behavior: smooth、scrollIntoView() 等行为都会静默失效。
容器必须设固定 height 和 overflow
局部滚动不是“加个属性就动起来”，而是浏览器根据盒模型规则判断是否生成滚动上下文。常见错误是只写 overflow-y: auto 却没设 height 或 max-height，此时容器高度由内容撑开，根本不可滚动。
-
height必须是具体值（如400px、calc(100vh - 80px)），百分比在无父级高度约束时无效 -
overflow推荐用overflow-y: auto，既避免横向干扰，又在内容不超长时不显示空滚动条 - 若用
display: flex布局，需额外注意：父容器要设flex-shrink: 0或min-height: 0，否则子容器可能被压缩导致scrollTop始终为 0
scroll-behavior: smooth 不继承，必须直接作用于滚动容器
很多人把 scroll-behavior: smooth 写在 html 或 body 上，指望它“透传”到子容器——不会生效。该属性只对自身具备滚动能力的元素起作用。
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
- 正确写法：
.chat-log { height: 300px; overflow-y: auto; scroll-behavior: smooth; } - 如果容器内嵌套了另一个可滚动区域（比如消息气泡里还有代码块滚动），内层也要单独加
scroll-behavior: smooth - 用户开启了系统偏好
prefers-reduced-motion: reduce时，该属性会被浏览器自动忽略，无需额外检测
锚点链接点击后滚动错位或跳整页？
这是最典型的局部滚动失控现象：点击 <a href="#section-2"></a>，结果整个页面跳了，而不是只在目标 <div class="scroll-container"> 内滚动。根本原因是原生锚点跳转作用于全局文档，无法自动降级到局部容器。<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>
<ul>
<li>解决方案是拦截默认行为，改用 <code>element.scrollIntoView() 主动控制：container.querySelector('#section-2').scrollIntoView({ behavior: 'smooth', block: 'start' })
display: none，否则 scrollIntoView() 静默失败，也不报错transform 或 will-change，可能创建新的层叠上下文，导致 scrollIntoView() 计算偏移出错，临时去掉再试用 JavaScript 控制 scrollTop 时边界容易越界
手动操作 scrollTop 是实现按钮滚动、自动滚到底部等逻辑的常用方式，但它的数值范围极敏感：超出 0 到 scrollHeight - clientHeight 就会卡死或无效。
- 向上滚动前检查：
if (container.scrollTop > 0) container.scrollTop -= 50 - 向下滚动必须限制上限：
container.scrollTop = Math.min(container.scrollTop + 50, container.scrollHeight - container.clientHeight) - 不要依赖
scrollHeight在 DOM 渲染完成前读取——它可能为 0，建议在DOMContentLoaded后或元素offsetHeight确认稳定后再初始化
真正麻烦的不是怎么写，而是容器是否“被认定为可滚动”。哪怕 CSS 写得再全，只要父级有 overflow: hidden、自身被 visibility: hidden 包裹，或者 JS 动态插入后未触发重排，scrollTop 就永远是 0，scrollIntoView() 就永远不响应——这些状态几乎无法从控制台直接看出，只能靠排除法验证。
