设置父级可调整大小图像的div高度

Question

<div style="height: auto">
    <img style='position: absolute; left:0; right:0; margin: -115px auto 0; overflow: hidden;' src='img_url' />
</div>

<div style="background: #ea9027; height: 150px;">
    etst text
</div>

当我调整浏览器的大小时，图像也正在调整大小（这就是我想要的，我不想要具有特定的高度和宽度，我希望它是100％的宽度浏览器屏幕）。但是当我调整浏览器大小时，两个div之间的距离会变大。我该如何解决？我需要使用javascript吗？第一个div中的height:auto无法正常工作。

Answer 1

我用javascript轻松解决了这个问题：

<script>
    function resize() {
        var img = document.getElementById('imageId'); 
        document.getElementById("imageIdDiv").style.height = img.clientHeight + "px";
    }
    resize();
    window.onresize = function() {
        resize();
    };
</script>

Answer 2

如果您不想使用javascript，只需使用vh: 100%;即可 这是css中的视口高度属性，它的效果非常好。