如何设置HTML iFrame铺满整页且无需滚动？

直接给iFrame设置height: 100%无效的核心原因是：CSS的百分比高度依赖父元素的高度，而HTML和Body标签默认是由内容撑开高度，并非占满整个浏览器视口。解决这个问题只需要两步：

1. 重置HTML和Body的样式，让它们占满视口
   先清除默认的边距、内边距，并强制设置高度为100%，同时隐藏页面滚动条避免冲突：

   html, body {
     height: 100%;
     margin: 0;
     padding: 0;
     overflow: hidden;
   }
   

2. 设置iFrame的样式
   给iFrame设置宽高100%，去掉默认边框，同时禁用自身滚动条：

   <iframe src="你的目标页面地址"
           style="width: 100%; height: 100%; border: none;"
           scrolling="no">
   </iframe>
   

额外说明 #

如果iFrame是嵌套在某个自定义容器内，那这个容器也必须设置height: 100%，否则iFrame的百分比高度会基于容器的默认高度（由内容撑开），依然无法铺满页面。

内容的提问来源于stack exchange，提问作者Jake StBu