0

首先，我对此很陌生，并且一直在做很多研究，但找不到答案。

我在页面顶部设置了一个 div 容器，宽度为 100%，高度为 20%。我想插入一个可以跨屏幕大小自动调整大小的图像。

我在这个网站上发现了一些代码，它们在 safari 和 chrome 中完美运行（在 ipad 和 iphone 上也可以完美调整大小），但在 Firefox（20）和 IE（10）中，图像确实会稍微调整大小，但不会留在父容器中。

任何人都可以帮忙吗？我一直在使用的原始代码是：

<html>
<style type="text/css">
#myDiv 
{
height:auto;
width:auto;
}
#myDiv img
{
max-width:100%; 
max-height:100%;
margin:auto;
display:block;
}
</style>


<div id="myDiv">
<img src="images/storm.jpg">
</div>
</html>

任何帮助将不胜感激（请记住我正在学习！）

4

1 回答 1

0 
#myDiv img
{
width:100%; 
height:100%;
margin:auto;
display:block;
}

您需要将图像的实际宽度/高度设置为 100%，而不是最大宽度和最大高度。

于 2013-05-15T10:06:53.403 回答