iframe的scrolling属性已废弃，应改用css控制滚动；同源可js注入overflow:hidden，跨域需目标页自设body{margin:0;overflow:hidden}，并注意祖先元素高度和默认margin影响。
iframe 的 scrolling 属性已废弃，别再用了
HTML5 中 scrolling 属性（如 scrolling="no"）在 <iframe></iframe> 上已被完全废弃，现代浏览器虽仍兼容，但会忽略它或触发控制台警告。W3C 明确要求用 CSS 控制滚动行为，而不是靠这个过时的布尔属性。
直接后果是：你在 Chrome/Firefox/Safari 里写 scrolling="no"，页面可能依然出现滚动条，或者滚动条消失但内容被截断——因为浏览器根本不按它执行。
用 overflow 替代 scrolling 的正确姿势
核心原则：对 <iframe></iframe> 元素本身设置 overflow: hidden 无效；必须作用于其内部文档的 body 或 html，但跨域 iframe 无法访问内部 DOM —— 所以实际能控的只有同源 iframe。
- 同源 iframe：可在加载完成后，通过 JS 注入样式到其
document.body，例如：iframe.contentDocument.body.style.overflow = 'hidden';
- 跨域 iframe：唯一可靠方式是让被嵌入页面自己控制，即在目标页面的
<style></style>中写：body { overflow: hidden; margin: 0; }，并确保没有其他样式覆盖 - 若只是想隐藏滚动条但保留滚动能力（比如用 JS 滚动），可用
overflow: scroll+ 自定义 scrollbar 隐藏（WebKit 可用::-webkit-scrollbar { display: none; }）
常见翻车现场：为什么加了 overflow: hidden 还有滚动条？
根本原因常被忽略：iframe 内容默认有 body 的 margin（通常是 8px），即使内容高度刚好，这个 margin 也会撑出滚动空间。
- 检查目标页面是否设置了
body { margin: 0; }—— 缺少这句，overflow: hidden基本白设 - 父容器（iframe 标签所在位置）若设置了固定宽高但未配
display: block，iframe 可能因 inline 默认行为产生底部空白，间接影响布局 - 使用
height: 100%时，所有祖先元素（包括html,body）都必须显式设height: 100%，否则百分比高度计算失效 - 某些 UI 框架（如 Bootstrap）会全局重置
body，但可能漏掉html，导致min-height: 100vh失效
更稳妥的替代方案：用 seamless？不，它也废了
曾经有人提过 seamless 属性（<iframe seamless></iframe>），意图让 iframe 更像内联内容，自动继承样式、隐藏边框和滚动条。但它从未被任何主流浏览器实现，且已在 HTML 规范中被移除。
目前真正可行的“无缝”效果，只靠组合手段：
- 服务端渲染时，把目标页面的
内容直接内联进父页（避免 iframe） - 前端用
fetch+DOMParser加载同源 HTML 片段，手动注入（注意脚本执行和相对路径问题） - 对跨域内容，接受 iframe 的固有限制，优先优化目标页自身样式，而非在父页硬控
跨域场景下，最易被忽略的是：你永远不能假设 iframe 内容尺寸可控 —— 它可能动态插入内容、响应式重排、甚至运行广告脚本推高高度。留点余量，加个 resize 监听器，比强求“无滚动条”更实际。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
