局部横向滚动需满足三个前提：容器有明确宽度、子项不换行、子项不被flex压缩；常见失效原因是内容未真正溢出，须用display:flex+flex-wrap:nowrap+flex:0 0 auto+overflow-x:scroll等组合确保可靠滚动。
局部横向滚动不是加个 overflow-x: auto 就能成——它必须满足三个硬性前提：容器有明确宽度约束、子项拒绝换行、子项不被 flex 自动压缩。缺一不可，否则滚动条永远不出现或拖不动。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
为什么加了 overflow-x: auto 还是不能滑动
最常见原因是内容没真正“溢出”：浏览器计算溢出的依据是「子项自然总宽度 > 容器 clientWidth」，而这个条件极易被破坏。
- 父容器没设
width或max-width（比如只写width: 100%，但上级是display: flex且没给宽） - 子项用了默认
flex-shrink: 1，被压窄后整行刚好塞进容器，根本没溢出 - 子项里误加了
white-space: nowrap，导致文本撑高、卡片变形，间接引发换行或高度塌陷 <table> 直接加 <code>overflow-x: auto必然失效——表格是独立格式化上下文，必须用外层<div> 包裹并设 <code>display: blockdisplay: flex+overflow-x: auto的最小可靠写法这是目前兼容性最好、翻车率最低的组合，每一步都在堵一个常见漏洞。
- 容器设
display: flex和flex-wrap: nowrap，确保子项死扛在一行 - 容器必须有明确宽度：用
width: 100%（前提是父级有宽）、max-width: 600px或具体像素值 - 每个子项设
flex: 0 0 auto（禁止缩放 + 不拉伸 + 宽度由内容定） - 显式加
overflow-y: hidden，避免 macOS 或触控设备出现双轴滚动条 - 移动端务必加
-webkit-overflow-scrolling: touch，否则 iOS Safari 滑不动或卡顿
怎么隐藏滚动条但还能滑动
隐藏的是视觉组件，不是滚动能力本身。删掉
overflow-x: auto就等于关掉滚动开关。立即学习“前端免费学习笔记（深入）”；
- WebKit 内核（Chrome/Safari/Edge）用：
::-webkit-scrollbar { width: 0; height: 0; } - Firefox 用：
scrollbar-width: none;（直接写在容器上） - 千万别用
overflow: hidden伪装——那会直接禁用所有滚动操作 - 若要彻底防止滚动条区域闪现，可用
margin-bottom: -16px物理遮掉（慎用，影响可访问性）
scroll-snap-type吸附对齐为什么没反应吸附失效几乎全是两个条件没同时满足：容器用了
overflow-x: auto（错），或子项宽度不一致（错）。- 必须用
overflow-x: scroll，不是auto—— Safari 和部分安卓 WebView 对auto下的吸附支持极差 - 子项必须严格等宽，或统一用
flex: 0 0 auto并保持左对齐基准一致；混用width: 200px和flex: 1会导致吸附错位 - 容器需加
scroll-padding-left（如scroll-padding-left: 16px）避免吸附后内容贴边看不清
最容易被忽略的点是：移动端没有鼠标滚轮，全靠手指拖拽，如果漏了
-webkit-overflow-scrolling: touch，iOS Safari 会静默降级为无惯性滚动，用户会以为“卡死了”。这不是 bug，是 CSS 规范里明确要求的渲染行为。- 容器设
