html <object> 标记的 height 属性未按预期工作答案

【问题标题】：height attribute is not working as expected for html <object> taghtml <object> 标记的 height 属性未按预期工作
【发布时间】：2016-04-12 09:54:32
【问题描述】：

我是 HTML 新手，从 w3schools 学习它。我正在查看对象标签并尝试在浏览器中显示 pdf。我无法理解为什么 height 属性在下面的代码中不起作用

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8"/>
    <title>try here</title>
  </head>
  <body>
    <object data="redBus_Ticket_25718916.pdf" type="application/pdf" height="100%" width="100%">sample</object> 

  </body>
</html>

我希望整个页面都是 PDF 文档。但我看到的是，

有人能告诉我这种行为的原因吗？

有趣的是，当我删除定义时，它按预期工作。不知道它们是如何相关的。请帮助我理解这种行为。

【问题讨论】：

标签： html

【解决方案1】：

在 CSS 或任何地方，也为 html 和 body 设置高度，

html, body{
   height: 100%;
   min-height: 100%;
}

我认为问题在于您的内容很小，因此文档本身不会占用太多空间，因此 100% 的文档不会显示在整个页面中。

不设置 html 和 body 的最小高度和高度，

JSFIDDLE 1

设置html、body的min-height和height后，

JSFIDDLE 2

【讨论】：

感谢您的解决方案。有效。您能否提供有关如何设置 min-height: 100% 解决问题的更多详细信息？ height: 100% 和 min-height: 100% 在特定于上述场景的用法上有何不同。
min-height 顾名思义将使文档和正文的高度至少达到 100%，即页面大小。但是如果你只设置高度，问题仍然是如果内容太小，它不能覆盖页面，那么最小高度是必需的。如果问题解决了，您可以将答案标记为已接受。
内容不小。它是一个包含 1 页内容的 PDF 文件。当我删除 DOCTYPE 定义时，我可以看到加载了预期高度的对象。你能解释一下这种行为吗？
DOCTYPE 是定义HTML5的使用，没有任何文档类型定义，它可能会表现出意外，你说它是预期的高度，不，不是，对我来说预期的高度是你得到的使用 DOCTYPE，你说内容是 1 个 pdf 页，没有内容只是对象标签，而对于一个对象标签，它的高度看起来是正确的。
@OptimusPrime 你说得对，它解决了我的问题。

【解决方案2】：

<script>
	$('object').attr({'width':$( window ).width()})
   	$('object').attr({'height':$( window ).height()});
</script>

 &lt;object data="index.html" type="text/html"&gt;&lt;p&gt;This is the fallback code!&lt;/p&gt;&lt;/object&gt;

【讨论】：