现代浏览器已废弃scrolling属性，正确做法是为iframe设置明确宽高和overflow:scroll，再用scrollbar-width:none、::-webkit-scrollbar等CSS规则隐藏滚动条视觉部分，而非禁用滚动。
直接给 iframe 加 scrolling="no" 或 overflow: hidden 是错的——前者早已被所有现代浏览器忽略，后者会彻底禁用滚动，内容切掉、scrollTop 失效、键盘方向键和屏幕阅读器无法访问。
iframe 容器上设 overflow: scroll + 浏览器专属隐藏规则
真正起作用的是对 iframe 元素本身应用 CSS 隐藏滚动条样式，前提是它已具备滚动上下文（即内容确实溢出）。必须同时满足：
-
iframe有明确宽高（如width: 600px; height: 400px），不能靠min-height或内容撑开 -
iframe的style或 CSS 类中设overflow: scroll或overflow-y: auto（visible不生效） - 针对不同内核补全伪元素或属性：
scrollbar-width: none（Firefox）、::-webkit-scrollbar（Chrome/Safari/Edge）、-ms-overflow-style: none（旧 Edge，可选）
可靠写法示例：
.my-iframe {
width: 600px;
height: 400px;
overflow: scroll;
scrollbar-width: none; /* Firefox */
}
.my-iframe::-webkit-scrollbar {
width: 0;
height: 0;
}
.my-iframe::-webkit-scrollbar-track {
background: transparent;
}
.my-iframe::-webkit-scrollbar-thumb {
background: transparent;
}子页面内部控制（同源前提下）
如果 iframe 加载的是同源页面（比如你自己托管的 content.html），更稳妥的方式是在子页面 <head> 里直接控制其 body 和 html 的溢出行为：
立即学习“前端免费学习笔记（深入）”；
- 仅隐藏滚动条但保留滚动：在子页加
body { overflow: auto; }+ 同样一套::-webkit-scrollbar规则 - 注意要同时设
html { overflow: auto; }，否则某些浏览器（尤其 iOS Safari）可能 fallback 到根滚动，导致样式不生效 - 不要只写
body { overflow-y: auto; overflow-x: hidden; }——若子页html没设高度约束，仍可能触发双层滚动，隐藏失败
跨域 iframe 下的限制与绕过
一旦 iframe 加载的是不同源页面（如 https://example.com 嵌入 https://baidu.com），父页面 JS 无法访问其 DOM，也就无法注入样式或修改 body.style.overflow。此时只能依赖容器级控制：
- 父页对
iframe元素本身应用前述overflow: scroll+ 伪元素隐藏方案（这是唯一可行路径） - 若该第三方页面自身设置了
overflow: hidden或固定尺寸，可能压根不产生滚动条，此时你加的隐藏规则无意义 - 别指望
scrolling="no"能起作用——HTML5 已移除该属性，Chrome/Firefox/Safari 全部无视 - 真要完全禁用滚动并裁剪内容，才用
overflow: hidden；但你要的是“能滚不见条”，这个值就绝对不能用
iOS Safari 和 macOS Chrome 的兼容性坑
即使代码写全，iOS Safari（尤其 16+）和 macOS 上新版 Chrome/Edge 仍可能闪现滚动条或忽略 width: 0：
-
::-webkit-scrollbar必须声明::-webkit-scrollbar-track和::-webkit-scrollbar-thumb，缺一不可；只写::-webkit-scrollbar { width: 0 }在 macOS 下大概率失效 - iOS 真机测试必不可少——模拟器常显示正常，实机滑动时可能因弹性回弹临时暴露原生滚动条
- 若父容器用了
transform或will-change，可能创建新层叠上下文，导致滚动条渲染异常；此时可尝试给iframe强加overflow: scroll强制重绘
最易被忽略的一点：隐藏滚动条不是“加样式”就完事，而是先确保浏览器判定出“这里该有滚动”，再把它视觉抹掉。任何破坏溢出判定的操作（比如子元素 position: absolute 超出、父容器没设 height、用了 overflow: visible）都会让整套方案归零。
