Question

我的插件工作正常但是当浏览器大小（更改）减少时，图像的宽度会根据浏览器屏幕大小而减小，但图像高度不会降低。

以下是代码：

 <div id="smart-gallery">
        <a href="images/cubagallery-img-1.jpg" title="First Image">
            <img src="images/cubagallery-img-1.jpg" /></a> 

            <a href="images/cubagallery-img-2.jpg"
                title="Second Image">
                <img src="images/cubagallery-img-2.jpg" /></a> <a href="images/cubagallery-img-3.jpg"
                    title="Third Image">
                    <img src="images/cubagallery-img-3.jpg" /></a> <a href="images/cubagallery-img-4.jpg"
                        title="Fourth Image">
                        <img src="images/cubagallery-img-4.jpg" /></a> <a href="images/cubagallery-img-5.jpg"
                            title="Fifth Image">
                            <img src="images/cubagallery-img-5.jpg" /></a> 
    </div>

以下是上述代码的css ..

.min-gallery
{
    max-width: 1400px;
    height: 630px;
    margin: auto;
}
.min-gallery .preview
{
    max-width: 1300px;
    height: 493px;
    margin-top: 36px;
    margin-left: 36px;
    margin-right: 36px;
    position: relative;

    overflow: hidden;
    background-color: White;
}

在上面的两个类中，我将宽度更改为最大宽度，因为此图像大小根据浏览器屏幕大小而变化。但是图像的高度没有变化，它是固定的。为此，我将属性，高度更改为最大高度，此时图像消失（意味着图像高度变为0px）。当它变为最小高度时，当浏览器屏幕尺寸增加时，图像高度不会增加。

我非常喜欢谷歌，但我没有得到如何解决这个问题。请任何人帮我解决这个问题。提前谢谢。

Answer 1

在班级.min gallary也是最大高度而不是正常高度，我认为应该修复它。

  .min-gallery{ max-width: 1400px;
max-height: 630px;
margin: auto;

}

为什么滑块高度不随着浏览器尺寸减小而减小？

1 个答案: