height="100%" 适用于 <object> 但不适用于 <img>，区别 HTML 与 CSS width/height 属性？

Question

我有两个代码，我不知道为什么使用 height=100% 只对图像有效？在其他情况下它什么也不做，内容选择最小高度对象忽略它而不是图像。

   <section id="corps">
      <object data="images/test.pdf" type="application/pdf" width="100%" height="100%">

      </object>
      <img src="images/test.png" width="90%" height="90%">
   </section>

另外，为什么宽度和高度属性在 html 中工作而没有 style = "..." 但像 min-height 这样的其他人需要它。仅仅是因为 html 支持这些吗？谢谢！

Answer 1

<style>
    #corps{ height: Xpx} //replace X with the value that suits you
    #corps object{height: 100%} //Now you'll get the 100% height
</style>

或者，如果您使用 position: absolute，那么 height: 100% 就可以正常工作。

关于为什么 <img src="images/test.png" width="90%" height="90%"> 有效，因为高度和宽度是图像的 HTML5 属性。你可以通过使用 <img src="images/test.png" style="width: 90%; height: 90%;"> 来实现同样的事情，现在这是 CSS.

height="100%" 适用于 <object> 但不适用于 <img>，区别 HTML 与 CSS width/height 属性？

height="100%" works with <object> but not with <img>, difference HTML vs CSS width/height property?

html

css

height

image

object