将 div 高度与柔性图像的高度匹配

Question

目前我只使用 HTML 和 LESS CSS...

我已将我的 img 标签设置为 max-width: 100%，这样基本上，我的图像都是灵活的，并且大小与它们在其中/上查看的窗口/屏幕完美匹配。

包含图片的是 div，其宽度总是 100%，但高度需要与图片相匹配。

如何使 div 的高度与（灵活的）图像相同？有没有办法只使用 HTML 和 LESS CSS 或需要 Javascript 来做到这一点？

任何帮助将不胜感激，谢谢:)

Answer 1

是的，您可以为此使用 clearfix ...

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

将“.clearfix”添加到包含 img 的 div。

Answer 2

试试下面的css：

overflow:auto;

图片所在的所有divs。