高度为 0 的 iframe 会产生间隙答案

【问题标题】：iframe with 0 height creates a gap高度为 0 的 iframe 会产生间隙
【发布时间】：2018-01-07 01:10:56
【问题描述】：

当我在正文之后直接添加 iframe 时，会导致上边距。有人可以解释一下吗？ iframe 没有高度和边距。

*, html, body {
  margin: 0;
  padding: 0;
  border: 0;
}
iframe {
  margin: 0;
}
body {
  background: gray;
}

<iframe width="0" height="0" frameborder="0" scrolling="no" vspace="0" hspace="0" marginheight="0" marginwidth="0" src=""></iframe>
<div style="background: red;">TEST</div>

看小提琴： http://jsfiddle.net/pLja65pc/1/

【问题讨论】：

拥有高度和宽度为零的 iframe 的目的是什么？
有一些网络跟踪工具，可以在页面顶部创建这样的 iframe。
奇怪……但没关系！为此，它通常使用 javascript！

标签： html css iframe

【解决方案1】：

Iframe 是一个内联元素，因此它会创建一个行框。行框的高度将等于行高（对于 16px 字体约为 18px）或更高（如果 iframe 大于字体大小）。

将 iframe 更改为 display: block 并将创建一个具有所需高度的块框。

【讨论】：

谢谢。这是有解释的最佳答案。

【解决方案2】：

将display: block; 添加到 iframe

*, html, body {
    margin: 0;
    padding: 0;
    border: 0;
}
iframe {
    margin: 0; 
    display: block;
}
body {
    background: gray;
}

<iframe width="0" height="0" frameborder="0" scrolling="no" vspace="0" hspace="0" marginheight="0" marginwidth="0" src=""></iframe>
<div style="background: red;">TEST</div>

【讨论】：

【解决方案3】：

请使用 iframe css 的显示块谢谢

【讨论】：