【发布时间】：2014-04-22 01:10:37
【问题描述】：
如何将图像的高度限制为以百分比指定高度的父容器？
如果图像宽度/高度 > 父级宽度/高度，我希望图像跨越父级。 如果图像宽度/高度
html, body{
width:100%;
height:100%;
}
#top{
height:10%;
}
#middle{
height:80%;
}
#bottom{
height:10%;
}
img{
width: how much?
height: how much?
}
<html>
<body>
<div id="top">I am top</div>
<div id="middle">
<img src="/images/abc.jpg" />
</div>
<div id="bottom">I am bottom</div>
</body>
</html>
【问题讨论】：
-
我如何请求将此问题取消标记为重复？？
-
重新开始投票。但它是一个骗局：stackoverflow.com/a/19193223/2888561
-
这是一个重复的问题吗？我希望父级是一个通用容器[没有固定的宽度或高度！] 此外，我批准的解决方案是使用 width:"auto" 和 height:100% 来避免图像拉伸。建议的问题为固定宽度和高度的父容器提供了解决方案。
-
容器无所谓，问题是容器。
width: auto应该无论如何都是默认的。 -
我很害怕，但这不是我想要的解决方案而且宽度自动不是 Chrome 最新浏览器的默认设置。