动态图像大小调整。

Question

我想使用标签将图片大小更改为200x150。你能帮我做一下吗？

Answer 1

您只需设置宽度和高度属性：

<img src="..." width="200" height="150" alt="..." />

请注意，这只会更改图像的显示方式。从服务器加载的文件仍然是相同的大小，因此加载时间仍然很长。此外，视觉效果因浏览器而异，一些最近的浏览器非常擅长调整图像大小，但通常这样调整大小的图像看起来非常糟糕。

如果你想要最好的质量，这种方法是行不通的。您必须调整实际图像的大小，而不是仅指定它的显示方式。

Answer 2

像这样：

<img width="200" height="150" src="..." alt="My Small Image" />

Answer 3

<img width="200" height="150" src="myimage.jpg" />

???

Answer 4

你的意思是这样吗？

<img src="path/to/img" width="200" height="150" />

Answer 5

其他答案都是正确的。他们做你所要求的。但是：

1. 质量可能会受到影响。制作漂亮的缩略图需要插值。
2. 如果图像小于您想要的尺寸，您将获得颗粒状图像。
3. 如果图像较大，您仍然会加载整个图像（并吸收带宽）。要解决此问题，您需要动态或静态地生成缩减采样缩略图。

要解决这些问题，您可以离线创建小图像（如果这适合您的应用）或冒险使用imagemagick或更类似的东西来提高效率。

Answer 6

正如Guffa所说，使用图像标记的width和height属性只会影响浏览器显示的方式。

如果你想调整你的图像大小，你可以使用服务器端代码（如asp.net，php，...）并提供调整大小的图像，或者你必须使用图片编辑器手动调整大小