表格横向滚动需外层div设overflow-x:auto及明确宽度，table加white-space:nowrap和table-layout:fixed，移动端需-webkit-overflow-scrolling:touch并避免flex干扰与transform等属性。表格内容超出容器时横向滚动不生效直接给 table 加 overflow-x: auto 没用——table 默认是块级但会自动撑宽，滚动容器必须套在外部 div 上，且这个 div 要有明确宽度限制（比如 width: 100% 或固定值）。常见错误现象：table 依然把页面撑开、横向滚动条不出现、或者只在部分浏览器里有效。容器 div 必须设 overflow-x: auto，不是 table 本身table 需要加 white-space: nowrap（防文本换行干扰宽度计算）移动端 Safari 对 overflow-x 支持较弱，建议同时加 -webkit-overflow-scrolling: touch如果表格有 width: 100%，它会优先适应父容器，失去“可滚动”的前提——此时应去掉或改用 min-width: fit-content移动端 Safari 滚动卡顿或无法拖拽Safari 对 overflow 容器的触控滚动支持不完善，尤其嵌套在 flex 或其他布局中时，容易失灵。使用场景：iOS 微信内置浏览器、iOS Safari、部分安卓 WebView。立即学习“前端免费学习笔记（深入）”；容器 div 必须设 display: block（避免被父元素 flex 压缩）加 -webkit-overflow-scrolling: touch 激活原生滚动惯性避免在滚动容器上设置 transform、will-change 等触发合成层的属性，可能干扰滚动事件捕获如果父元素用了 overscroll-behavior: contain，可能拦截滚动传递，需检查并移除表格列宽失控导致横向滚动失效即使容器设置了 overflow-x: auto，如果某列（比如图片、长文本、input）没有宽度约束，table 仍会无限撑宽，滚动还是出不来。 通义听悟 阿里云通义听悟是聚焦音视频内容的工作学习AI助手，依托大模型，帮助用户记录、整理和分析音视频内容，体验用大模型做音视频笔记、整理会议记录。