css - 如何将图像宽度和高度调整为 100 x 100 保持比例？

Question

这里有2张图片

1. 宽度:300px，高度:200px
2. 宽度:200px，高度:600px

我希望这两个都显示如下

1. 宽度:100px，高度:66.6px
2. 宽度:33.3px，高度:100px

这些调整为 100px 的最大保持比例。 如何用 CSS 编写？

Answer 1

将下面的 .resize 类应用到您的图像应该可以实现您想要的...

.resize {
    max-width: 100px;
    max-height: 100px;
}

示例:http://jsfiddle.net/rU5qK/