要让独立滚动不带动整页，需设置固定尺寸+scroll-behavior: smooth+position: relative，禁用锚点跳转，用container.scrollTo精准控制滚动位置，并注意父级CSS属性干扰。
直接让某个 <div> 自己滚，不带动整页，关键不是加 <code>overflow: auto 就完事——得锁住滚动上下文、禁用默认锚点跳转、再用 JS 精准控制目标位置。
给容器设固定尺寸 + scroll-behavior: smooth
独立滚动的前提是容器有明确边界和滚动能力。光写 overflow-y: auto 不够，容易被父级高度撑开或被 flex 布局“吃掉”高度。
-
height或max-height必须显式设置（比如300px或calc(100vh - 120px)） - 加上
scroll-behavior: smooth让 JS 触发的滚动也平滑 - 加
position: relative—— 后续 JS 用offsetTop计算位置时，需确保它相对于这个容器而非整个文档 - 避免内部元素用
position: fixed，否则会脱离该容器上下文，滚动时“飞出去”
禁用 的默认跳转行为
点击带 #id 的链接，默认会触发整页滚动并聚焦到目标元素，破坏局部滚动隔离。
- 在导航链接上加
event.preventDefault()，彻底拦截原生行为 - 不要只靠
return false，它在某些事件绑定方式下可能无效 - 如果用了
<router-link></router-link>或框架路由，也要检查是否开启了scrollBehavior并覆盖为 noop - 目标元素（如
<div id="section-2">）不需要加 <code>tabindex，除非你还要支持键盘聚焦用 element.scrollIntoView() 或 scrollTop 精确滚动
滚动动作必须作用于容器本身，而不是
window或document。
htmlppt.skill下载把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
立即学习“前端免费学习笔记（深入）”；
- 推荐用
container.scrollTo({ top: target.offsetTop - container.offsetTop, behavior: 'smooth' })，比scrollIntoView更可控（后者在嵌套容器里容易计算错参考系） - 注意：
target.offsetTop的值依赖容器是否设置了position: relative，否则会回退到body作为基准 - 如果目标元素是动态插入的，滚动前要等 DOM 更新完成（Vue 用
nextTick，React 用useLayoutEffect） - 移动端 Safari 对
scroll-behavior: smooth支持不稳定，可降级为behavior: 'auto'+ CSSscroll-snap-type辅助对齐
小程序里用 scroll-view 要防父页面联动滚动
小程序没有原生
scroll-behavior，且容易出现“一拉就整页动”的 bug。- 必须在
pages.json中对应页面配置"disableScroll": true，否则scroll-view拉到底后会透出父页面滚动 -
scroll-view的高度不能靠100%继承，得用px或rpx显式计算（比如减去自定义导航栏、按钮、状态栏高度） -
@scrolltolower触发时，记得加防抖（setTimeout+ 标志位），否则快速上拉可能多次触发加载 - 避免在
scroll-view内放position: sticky元素——小程序基础库对 sticky 的支持有限，常失效
最易忽略的一点：滚动容器的父级如果有
transform、filter或will-change，可能创建新的层叠上下文，导致scrollIntoView计算偏移错乱。遇到滚动定位不准，先查父级有没有这些属性。 - 推荐用
