HTML img缩放 [英] HTML img scaling

问题描述

我试图用HTML img标签显示一些大图片。此刻他们离开了屏幕边缘;我怎么能缩放它们以保持在浏览器窗口内？

或者在可能的情况下，这是不可能的，是否可以至少说它的正常宽度和高度的50％？

宽度和高度属性会扭曲图像 - 据我所知，这是因为它们引用任何属性容器可能最终与图像无关。我无法指定像素，因为我必须处理每个像素大小不同的大量图像。最大宽度不起作用。

解决方案

只设置宽度或 height ，它会自动缩放另一个。您可以使用百分比。

第一部分可以完成，但需要JavaScript，因此可能无法适用于所有用户。

I'm trying to display some large images with HTML img tags. At the moment they go off the edge of the screen; how can I scale them to stay within the browser window?

Or in the likely event that this is not possible, is it possible to at least say "display this image at 50% of its normal width and height"?

The width and height attributes distort the image -- as far as I can tell, this is because they refer to whatever attributes the container may end up with, which will be unrelated to the image. I can't specify pixels because I have to deal with a large collection of images each with a different pixel size. Max-width doesn't work.

解决方案

Only set the width or height, and it will scale the other automatically. And yes you can use a percentage.

The first part can be done, but requires JavaScript, so might not work for all users.

这篇关于HTML img缩放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！