即使在将 frameborder 设置为 0 之后，iframe 边框周围仍然存在空白答案

【问题标题】：White space is still present around the iframe border even after after setting frameborder to 0即使在将 frameborder 设置为 0 之后，iframe 边框周围仍然存在空白
【发布时间】：2011-04-30 15:18:15
【问题描述】：

即使将 iframe 中的 frameborder 属性设置为 0，iframe 边框周围仍然存在一些空白（与原始 url/链接页面不同）。是否有任何其他方法可以消除空白，或者必须在 iframe 周围显示一些白色，因为它位于网页（或网页的一部分）内，并且不能是整个页面？谢谢。

【问题讨论】：

您可以发布您的 iframe 代码，以及您在 iframe 内应用于文档的样式吗？猜测一下，我会说您需要将包含文档的 body 上的填充设置为 0，但这是在没有信息的情况下的猜测。 :-)
Y 看起来是这样，并且已经解决了。感谢您的帮助

标签： html css iframe whitespace

【解决方案1】：

也许那个空白实际上是在<iframe> 中加载的文档的外边距。尝试为加载的文档设置样式：

html, body {
    border: 0px;
    margin: 0px;
    padding: 0px;
}

【讨论】：

谢谢。我认为你说的是真的，我使用了你写的代码，它对我有用。感谢您的回答。
男人！你解决了一个问题！我的代码给了我这样的问题并使用了您的建议。你拯救了弗雷德里克的一天！

【解决方案2】：

在下面应用到 iframe

display: block

【讨论】：

为我工作。谢谢！

【解决方案3】：

通过添加这个 CSS，我们可以让 iframe 全屏显示

body,html
{
    background-color:#DDEEDD;
    padding:0px;
    margin:0px;
    height:100%;
    width:100%;
    overflow:hidden;
}
iframe
{
    margin:0;
    padding:0;
    border:none;
    overflow:hidden;
    background-color:#DDEEDD;
}

【讨论】：

一些不必要的重复，对吧？ iframe 也可以在 html 和 iframe 部分删除之后。无论如何，这是唯一对我有用的建议，所以谢谢！

【解决方案4】：

试试这个：

  <iframe bgcolor=#FFFFFF frameborder=0 vspace=0 hspace=0 marginwidth=0 marginheight=0 width=100%
   height="340" 
   src="myframe.html">
 </iframe>

【讨论】：

这个，连同上面提到的 html，body{} 属性 - 以及使用 scrolling="auto" - 解决了一个 10 像素的填充，该填充似乎被添加到包含图片。这个增加的空间导致垂直滚动条在使用 Firefox 时不希望出现。当您将浏览器单独指向图像时，我试图利用 Firefox 的自动调整大小和缩放功能。当您在 iframe 中尝试此操作时 - 它会在图像底部添加额外的空间 - 或者 iframe 本身就像裁剪图像一样。
我用来摆脱垂直滚动条的最终 iframe 设置是：也许这个问题值得单独发一篇文章？
你在上面的评论中的回答对我来说是在为 iframe 上网后喘不过气来的。

【解决方案5】：

只需在<iframe > 标签内添加style="margin: 0 0 0 0"。

示例：

<iframe src="http://www.yahoo.com" style="margin: 0 0 0 0"></iframe>

如果你想要margin，你必须在数字后面加上'px'

（感谢 Safari 浏览器的“检查元素”工具）这解决了我的解决方案。

【讨论】：

【解决方案6】：

Frederic 的提议解决了我的问题：如何在 safari 浏览器的全屏幻灯片中摆脱白色边框。完美的！非常感谢，wimsch [由于我无法对他的回答添加评论 [[

【讨论】：

【解决方案7】：

试试这个

<iframe src="....." style="position:absolute;"></iframe>

【讨论】：

【解决方案8】：

我遇到了类似的问题：我将 iframe 放在 figure 标记内，并且 iframe 和 figcaption 元素之间有一些空白。

<figure>
  <iframe></iframe>
  <!-- white space was here -->
  <figcaption></figcaption>
</figure>

就我而言，只需添加 iframe { display:block } 即可解决问题。

【讨论】：