局部滚动需容器设固定高度+overflow-y:auto，父级Flex布局下加flex-shrink:0，移动端必加-webkit-overflow-scrolling:touch，JS滚动须绑定容器并校验目标存在。
局部滚动不是加个 overflow: auto 就能跑起来的，90% 的失效都卡在容器没“立住”——它必须有明确的高度边界，且不能被父级 Flex 或定位逻辑意外压缩。
容器必须设固定高度 + overflow-y: auto
这是唯一前提。没有高度，scrollTop 永远是 0，滚动条不出现，scrollIntoView() 也找不到目标位置。
- 用
height（如300px）、max-height（如60vh）或rem，别依赖%（除非父级高度已定死） - 写
overflow-y: auto比overflow: auto更稳妥，避免误触发水平滚动 - 如果父级是
display: flex，滚动容器自身要加flex-shrink: 0，否则会被压扁到无高度 - 别用
overflow: hidden“掩盖问题”，它直接关掉滚动能力
移动端必须开 -webkit-overflow-scrolling: touch
iOS Safari 和多数 Android WebView 下，没这句就只有“拖不动”或“一松手就回弹”，不是卡顿，是根本没启用惯性滚动引擎。
- 该样式只对
position: relative、absolute或fixed的容器生效；static容器下常被忽略 - 不能和
transform: translateZ(0)或will-change: transform共存，iOS 16+ 会分裂渲染层，反而更卡 - 配合
viewportmeta 标签：必须同时含width=device-width和initial-scale=1.0，缺一不可
JS 控制滚动时别直接调 scrollIntoView()
默认行为是滚整个页面，不是你想要的局部容器。必须显式绑定到容器对象，并校验目标是否在其中。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
- 正确做法：
container.scrollBy({ top: 40, behavior: 'smooth' })（推荐）或container.scrollTo({ top: target.offsetTop - container.offsetTop, behavior: 'smooth' }) - 更健壮的偏移计算：
target.getBoundingClientRect().top - container.getBoundingClientRect().top + container.scrollTop - 务必先检查
container.contains(target)，防止目标不在该容器内却强行滚动 - 避免在
scroll事件里读取scrollTop——每次读都会强制 layout，长列表中极易掉帧
隐藏滚动条但保留功能，分平台处理
iOS Safari 完全不支持 ::-webkit-scrollbar，任何针对它的 CSS 都会被静默忽略。强行统一写法只会让 iOS 用户失去滑动反馈。
- Chrome / Edge / Safari（macOS）：用
::-webkit-scrollbar { display: none; } - iOS：靠
overflow-y: auto+-webkit-overflow-scrolling: touch保证可滑动，视觉无滚动条是正常表现 - Firefox：不支持伪元素，但 touch 滚动照常工作，无需额外 hack
- 千万别删
overflow-y: auto去“隐藏”，那是废掉滚动能力本身
最易被忽略的是：Flex 布局下，滚动容器的“直接父级”往往才是关键控制点——它要么得设 overflow: hidden，要么得给明确高度，否则子容器再怎么设 height 也会被撑开或塌陷。
