Question

我在div中有一个绝对定位的图像，我希望该div的高度由图像定义。但是，我无法弄清楚如何在图像上启用绝对定位时这样做。最终我会在这个div中使用多个绝对定位的图像，这就是我要走这条路的原因。有什么想法吗？

HTML：

<div class="image">
    <img class="image1" src="image1.jpg" />
</div>

CSS：

.image {
  position:relative;
}
.image1 {
  width:100%;
  position:absolute;
}

谢谢！

Answer 1

我最终用jQuery解决了这个问题。在文档加载时，包含div的高度设置为图像的高度，我也使用Foundation，所以我添加了一个resize事件来更改div的高度，因为当窗口变小时图像会缩小。

<script type="text/javascript">
$(document).ready(function() {
    var imageHeight = $(".image1").height()
    $(".image").css('height',imageHeight);
});
$(window).resize(function() {
    var imageHeight = $(".image1").height()
    $(".image").css('height',imageHeight);
});
</script>

Div高度由图像定义，具有绝对定位？

1 个答案: