iframe的高度为0会产生间隙

时间:2015-01-09 10:55:41

标签: html css iframe

当我在身体后面直接添加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>
&#13;
&#13;
&#13;

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

3 个答案:

答案 0 :(得分:6)

iframe是内联元素,因此它将创建一个行框。线框的高度将等于线高(16px字体为~18px)或更高(如果iframe高于字体大小)。

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

答案 1 :(得分:1)

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>

答案 2 :(得分:0)

请使用iframe css的显示块 感谢