html网页大小自动调整大小,根据电脑屏幕分辩率大小自动调整网页宽度

目前，电脑显示器主要为液晶显示器，它们的屏幕大小参差不齐，分辨率自然也大小不一，从面导致同一大小的网页在不同分辨率的电脑显示千差万别，可能有的显示正常，有的显示乱。这就要求在设计网页时处理好这个问题，使网页在每种电脑屏幕的分辨率都能正常显示。要达到这个要求，就需要根据电脑屏幕大小自动调整网页的宽度。

自动调整网页宽度一般来说用 javascript 来实现，但 CSS3 问世之后，也能用 CSS 实现，由于在前面的文章中已经介绍过用 CSS3 中的媒体查询(media)自动调整网页宽度，因此本篇主要介绍用 javascript，方法特别很简单，一两句代码就能实现，不像媒体查询每种分辩率的电脑屏幕都要定义一次。

根据电脑屏幕分辩率大小自动调整网页宽度实例

一般来说，根据电脑屏幕分辩率自动调整网页宽度用于宽度不限制或用百分比的情况，限制宽度的情况没必要再自动调整，所以主要用于网站后台或前台用百分比的情况。以下是网站后台用 iframe 框架自动调整网页宽度的具体代码：

html代码：

javascript代码：

window.onload = function () {

var rid = document.getElementById("rightId");

if (rid.Document) {

rid.style.width = document.body.scrollWidth - 200;

}

else {

rid.style.width = document.body.scrollWidth - 200 + 'px';

}

}

以上代码虽然是用于网站后台的，但前台用百分比的情况跟它也差不多，只需稍微改一改代码就能实现。