Question

我有点问题。我有不同尺寸的图像，我想拉伸。相对于蓝色div元素的高度，高度应 40％。

我该怎么做？我无法使用修复大小，因为当我调整浏览器大小时，div和img元素也应该自动调整大小。

enter image description here

有什么想法吗？

电贺， yab86

Answer 1

尝试这样的事情：

<html>
<head>
<style type="text/css">
div{
    width: 24,5%;
    height:100%;
    background-color:blue;
}
div img{
    height:40%;
    max-width:100%;
}
</style>
</head>
<body>
<div>
     <img src="test.jpg" />
</div>
</body>
</html>

高度为40％，图像保持其比例，永远不会超过div的宽度。希望这就是你所需要的。

Answer 2

这是你的答案 - 它确实有效：

div{
    width: 24,5%;
    height:100%;
    background-color:blue;
}
$(document).ready(function(e) 
{
    $('div img').css('height',window.innerHeight);
    window.onresize = function(event) 
    {
            $('div img').css('height',window.innerHeight)
    };
});

相对于div自动调整图像大小

2 个答案: