0

无论如何，CSS 和/或 JavaScript/jQuery 是否可以仅在需要将剩余内容放入固定高度容器中时才可以调整图像大小？如果您在下面的屏幕截图中查看新的本周和每周特价部分中的图像，您就会明白我的意思。但是，在某些情况下，一切都适合，因为图像足够小并且它们下方的文本量不是很大。

在此处查看示例

4

3 回答 3

2

不，不是您所描述的仅使用 CSS。但是，是的，使用 jQuery 你可以做到这一点。

我个人对 jQuery 的效率不够高，无法尝试为您提供编码解决方案，但从概念上讲，您可以执行诸如检查子元素组合的计算高度之类的操作，然后将其与父容器的高度相匹配。然后，如果子元素大于固定元素的高度，则计算差值并将该新值作为内联高​​度属性或内联样式属性添加到图像上。

于 2012-05-31T02:34:32.357 回答
2

使用 jQuery：

$(document).ready(function() { $('div.item img').each(function() {
    var image = $(this);
    var div = $('div.item p');
    if ((image.height() + div.height()) >> $('div.item').height()) {
        while ((image.height() + div.height()) >> $('div.item').height()) {
            image.height(image.height() - 1);
        }
    }
});});
于 2012-05-31T02:31:17.303 回答
0

设置 max-height CSS 属性有什么问题？

<img src="big.jpg" style="max-height:300px">

然后将 CSS 表达式添加到解决方法 IE6

<img src="big.jpg" style="max-height:300px; _height:expression(Math.min(this.offsetHeight, 300))">
于 2012-05-31T03:51:22.493 回答