动态调整图像大小。

Question

我想使用标签将图像大小更改为200x150。你能帮我做这件事吗？

Answer 1

像这样：

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

Answer 2

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

???

Answer 3

您的意思是？

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

Answer 4

你刚才设置的宽度和高度属性：

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

请注意，这只是更改如何显示图像。从服务器加载的文件尺寸仍然相同，因此加载时间仍然很长。此外，从浏览器到浏览器的视觉效果也各不相同，一些最新的浏览器在调整图像大小方面非常出色，但通常这种调整大小的图像看起来很糟糕。

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

Answer 5

其他答案是正确的。他们按照你的要求去做。但是：

1. 质量可能受损。制作一个漂亮的缩略图需要插值。
2. 如果图像比您想要的尺寸小，您会看到一个粗糙的图像。
3. 如果图像较大，您仍然会加载整个事物（并吸取您的带宽）。为了解决这个问题，您需要动态或静态地生成缩减采样缩略图。

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

Answer 6

正如Guffa所说，使用图片标签的宽度和高度属性只会影响浏览器显示的方式。

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