如何让iframe在设置负上边距后填充整个移动网页

How to have an iframe fill up the entire mobile web page after setting a negative top margin

本文关键字：填充 移动 网页 移动网 iframe 设置      更新时间：2023-09-26

我现在有一个iframe填满了我的整个页面，但我想给它一个-40px的上边距，让它看起来更好。

iframe位于移动页面上，宽度为640像素，高度为100%。

我试着做：height="calc(100% + 40px)"，但似乎不起作用，相反，它在我的页面顶部给了我一个小条的宽度。

但这基本上就是我想要的，我想在把它提升到40px之后，把它扩展到页面的底部。

请有人来救我一天哈哈！

代码：

<html>
<meta content='width=350px, user-scalable=0' name='viewport' />
<body style="margin: 0; height: 100%;">
<iframe style='margin-top: -40px;'
  src="URLHERE"
  frameborder="0"
  width="350px"
  height="100%">
</frameset>
</body>
</html>
</iframe>

你需要按照@APAD1所说的做，再加上在你100%的身高上增加40px。然而，这也会将你的滚动条向上移动40px，并可能在最初将其隐藏

html, body
{
   height: 100%;
   overflow: hidden;
}
   .iframe
{
   position:absolute;
   top:-40px;
   left:0;
   width:100%;
   height:calc(100% + 40px);
}

Fiddle here：http://jsfiddle.net/60xs8bro/

相关文章：