在保持比例的同时在 html 中生成“缩略图”答案

【问题标题】：generate "thumbnail" in html while keeping proportions在保持比例的同时在 html 中生成“缩略图”
【发布时间】：2009-10-20 18:47:10
【问题描述】：

是否可以在保持比例的同时缩小 html 中的图像？

我知道我可以使用img标签的height和width属性，但是我不知道图片的大小。

请不要告诉我在服务器上找出图像大小，或者说正确的方法是在服务器端生成缩略图，这样可以节省带宽并提高页面加载时间。

我知道理想的解决方案是什么。但我想要又快又脏……

【问题讨论】：

【解决方案1】：

又快又脏：只需在 img 标签中设置一个属性：

<img src="my.jpg" width="200" /> or <img src="my.jpg" height="200" />

【讨论】：

【解决方案2】：

是的。只需使用高度或宽度。

但又快又脏的是very dirty。

【讨论】：

该链接证明了浏览器调整大小的质量非常依赖于浏览器：我在 Chrome、IE 和 Firefox 中尝试过。在 IE 和 Firefox 中，很明显它使用了“快速”过滤器，但它的质量略好于“快速”预处理图像。在 Chrome 中，浏览器调整大小的图像实际上质量非常好。它实际上比高质量的预处理图像更好！
我给了你+1，因为你在两个解决方案中都是正确的（使用高度或宽度），并且基于使用比必要更多的带宽，它非常脏。

【解决方案3】：

还请记住，您也可以将原始宽度/高度的百分比作为值，例如：

<img src="my.jpg" width="50%" />

【讨论】：