Question

iframe =内联？

今天调试一些布局问题时，我很惊讶<iframe>元素的默认显示属性为inline。

对我而言，这似乎很奇怪，特别是考虑到您可以将height和width应用于浏览器所尊重的<iframe>，这不应该是简单的情况直列元件。

那么有人能解释一下这背后的原因吗？

演示

HTML

<iframe id="test"></iframe>

CSS

alert($('#test').css('display'))

谢谢！

Answer 1

因为HTML4规范如此说：

IFRAME元素允许作者在a中插入一个框架文本块。在文本部分中插入内联框架是就像通过OBJECT元素插入一个对象一样：它们都是允许您将HTML文档插入另一个HTML文档的中间可以与周围的文本等对齐。

“与周围文本对齐”部分意味着默认情况下它们不应该是块级别。

通常情况下，内联元素会忽略height和width属性：

10.3.1 Inline, non-replaced elements

width属性不适用。

10.6.1 Inline, non-replaced elements

height属性不适用。

但对于被替换的元素，例如iframe，情况并非如此。 10.3.2和10.6.2部分对此进行了解释。

Answer 2