网页制作中的背景处理

　　在制作网页过程中，经常需要考虑页面中的留白问题，因为我们设计时，按大多数用户显示器的设置来制作内容区，即横向分辨率的设置是1024像素，可是用户设置是多样化的比如有的用户是1280、1440、1600、1680等，内容区之外会有很多的留白，为了美观起见，不可避免地需要对留白区进行一些处理。 　　下面是一般的做法。 　　1、用一个图片来做背景，其余的地方填充颜色。 　　　　①背景图很大，不铺； 　　　　②背景图片很长，只是横向铺而纵向不铺； 　　　　③一张图片横向纵向都铺。 　　　　根据效果选择，关键是背景图片的处理。 　　2、留白的地方要多样化，可以用多个垂直叠放的DIV来处理，中间内容区域都设置为996px，DIV里面的背景图可以按照1所列的方法，这样的效果是比较理想的，就是选择和处理背景图片需要一些功夫。 　　3、采用脚本控制，判断用户设置的横向分辨率如果大于1024，则DIV显示，否则就不显示。 　　先把一些处理写成样式，然后 　　if(screen.width>=1024){ 　　　　 document.write("样式表的内容"); 　　} 　　或者应用Jquery进行属性的修改.

　　有时候根据需要进行背景变换，那么可以通过脚本来实现。 　　function ChangeBG(SSelect)  　　{  　　　　if(SSelect == 'color')  　　　　{  　　　　//改变背景色  　　　　　　document.body.style.backgroundColor="颜色代码"; 　　　　}  　　　　if(SSelect == 'image')  　　　　{  　　　　//改变背景图片 　　　　　　document.body.style.backgroundImage="url(图片路径和名称)";  　　　　}  　　}  　　在对DIV进行背景铺设时，也可以用脚本来控制显示背景。 　　随机背景： 　　var BgPic = []; 　　BgPic[0] = "图片路径和名称１"; 　　BgPic[1] = "图片路径和名称２"; 　　BgPic[2] = "图片路径和名称３"; 　　var IRand = Math.round( Math.random() * 3 ); 　　document.write('body{background:url(' + BgPic[IRand] + ');background-repeat:repeat-x;background-color:#e7e7e7; }');

　　PS：背景的属性如下：

　　background-color:#333;

　　background-image:url(bg.jpg);

　　background-repeat:no-repeat;

　　background-attachment:fixed;

　　background-position:10px 10px;

　　可以缩写为一句：background:#333 url(bg.jpg) no-repeat fixed 10px 10px;