Question

我正在进行流畅的布局，我在缩放图像方面遇到了麻烦。我最近一直在使用绝对宽度和高度，但这在许多情况下都会引起问题。

我的源图像宽1642像素，高760像素。

有没有办法做一些涉及百分比的事情，就像你可以在Photoshop中按比例缩放图像一样？假设我希望图像的高度与其容器的高度相同，但宽度在这个意义上是成比例的。

Answer 1

您需要做的只是指定图像高度，宽度将按比例缩放。

img{
    height:100px;
}

检查http://jsfiddle.net/jncnE/

处的工作示例

Answer 2

在任何变体中都没有为我工作，即使有！重要。仅指定高度限制会压缩图像，宽度不会缩放，反之亦然。

我在这里找到了另一个线程的解决方案。您必须根据需要将一个维度设置为自动。

.containerName {
width: auto;
height: 150px !important;
}

我使用重要来覆盖另一个我无法改变的设置。