如何在 HTML5 中并排使用 iframe 时删除空格答案

【问题标题】：How to remove whitespace while using iframes side by side in HTML5如何在 HTML5 中并排使用 iframe 时删除空格
【发布时间】：2018-05-12 22:12:56
【问题描述】：

如何从并排放置的两个框架中删除空白？

我试过了：

html,
body {
  margin: 0px;
  padding: 0px;
  border: 0px;
  width: 100%;
  height: 100%;
}

iframe {
  margin: 0px;
  padding: 0px;
  border: 0px;
  height: 100%;
}

<iframe name="l" src="l.htm" style="width:10%;" scrolling="no"></iframe>
<iframe name="c" src="c.htm" style="width:75%;" scrolling="no"></iframe>
<iframe name="r" src="r.htm" style="width:15%;" scrolling="no"></iframe>

我也看过这个answer，但它是说通过使用显示属性作为display: block 不会有空格。但如果我使用该属性，我的框架将在彼此下方而不是并排。我希望我的帧并排为 10%、75%、15%。

【问题讨论】：

标签： css html iframe

【解决方案1】：

HTML 源代码中的空格很重要。

比较这两段：

<p>
a
b
c
</p>
<p>abc</p>

删除源代码中内联项之间的空格以将其从呈现的显示中删除。

html,
body {
  margin: 0px;
  padding: 0px;
  border: 0px;
  width: 100%;
  height: 100%;
}

iframe {
  margin: 0px;
  padding: 0px;
  border: 0px;
  height: 100%;
}

&lt;iframe name="l" src="l.htm" style="width:10%;" scrolling="no"&gt;&lt;/iframe&gt;&lt;iframe name="c" src="c.htm" style="width:75%;" scrolling="no"&gt;&lt;/iframe&gt;&lt;iframe name="r" src="r.htm" style="width:15%;" scrolling="no"&gt;&lt;/iframe&gt;

【讨论】：