图像调整HTML5的大小

时间:2012-05-10 17:05:56

标签: html css html5

所以我有想要在HTML5代码中全屏显示的图像。我将它们的高度和宽度设置为100%,我认为应该调整大小。

如果我放置的图像是3240x480,它们适合我的手机就好了,但是在iPad上拉伸它似乎适合的高度,但宽度似乎保持在320.

如果我放置在768x1004的图像中,它们可以完美地适合iPad,但在手机上它们显示为大型。我以为100%会做重新缩放,但我想我错了。

所以我尝试将图像设置为768x1004到width =“window.innerWidth”。这在手机上很好地缩小了,除了它仍然延伸超过屏幕的界限。至于iPad,它会缩小宽度,所以现在图像和屏幕墙之间存在间隙。

任何想法如何获得干净简单的自动调整大小以适应屏幕,最好只有1个图像。或者我如何设置它以便有多个图像并且如果iPad正在使用其他明智的手机尺寸图像(如果使用的是手机),它会将图像放入iPad尺寸?

谢谢

1 个答案:

答案 0 :(得分:0)

我很确定,你不能,如果没有真正破坏图片的质量,请调整图像大小。但我知道您可以使用脚本将用户重定向到适合其屏幕的网站。查看此网站http://www.dynamicdrive.com/dynamicindex9/info3.htm或Google“屏幕重定向”,您可以看到几个替代方案! :))