如何让网站上的图片自动适应不同分辨率的机子显示

最原始的方式是做自适应网页,就是不制定网页的具体大小,让浏览器去自动调整显示方式。纯文本网页还可以这样做,但现在的网页普遍包含有图片、动画,需要精确定位,这种方式就不行了。这样的网页会导致在不同的分辨率下用户看到的网页不一样,不能满足设计要求,所以现在一般不采用这种自适应网页。

目前最常见的办法是按小的分辨率来做,把网页做成适合800×600的页面。这样用更大的分辨率时也能正常显示,只是页面两边会有空白区。这种方法是目前大多数网站采用的方案,像国内很多门户网站都是这样设计的,比如新浪、搜狐、网易等。而且现在他们也将两边的空白区利用来显示广告了,用800×600分辨率就看不见这个广告。

当然,还有一种看上去更科学但不实际的解决方案,就是在网页中用代码来获取用户的屏幕分辨率,然后根据不同的分辨率选择不同的页面来显示。这种方案需要为相同内容准备多套网页,图片、动画等素材也需要准备不同分辨率的,导致网页维护的工作量大大增加,似乎只有那种不怎么更新的网站可以使用。但现在液晶显示器和笔记本电脑越来越普及,宽屏显示也开始出现,各种不同的屏幕分辨率模式越来越多,要适应这么多种分辨率真是一件很困难的事。所以这种方案实际也用得也极少。

作者: sq1990   发布时间: 2010-12-27