用DIV+CSS写网页背景代码时，应该先写一个DIV，在这个DIV的CSS里面添加背景图片，并设置其margin为auto，宽度为100%或者auto；然后在这个DIV里面在写一个DIV，在第二个DIV里面设置CSS样式，宽度为背景图片的实际宽度，然后在写在背景图片之上的其他内容，这样用户在缩放浏览器的界面时，这个div里面的内容可以与图片位置相对固定，使排版不会随着界面的缩小或者放大而改变；具体代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> /*---gywm---*/ .gywm { width:auto; height:430px; background: url(../images/gywm-bg.png) no-repeat center 0; color:#fff; } .gywm-con { width:1160px; margin: 0 auto; } .gywm h3 { font-size:36px; padding-top:40px; font-weight: normal; } .gywm p { font-size:18px; padding-top:35px; width:450px; line-height:37px; } .gywm span { font-size:24px; padding-top:235px; line-height:90px; color:#333; padding-left: 30px; } .gywm img { padding-top:35px; } </style> </head> <body> <!--/关于我们--> <div class="gywm"> //第一个div设置宽度为auto，可以使背景图片自动适应屏幕的大小，放大或缩小浏览器界面时图片可以居中显示； <div class="gywm-con"> //第二个div设置宽度为背景图片的真实宽度，使用户在缩放浏览器的界面时，这个div里面的内容可以与图片位置相对固定，使排版不会随着界面的缩小或者放大而改变； <h3>窈窕书女</h3> <p>窈窕书女是为了继承和发扬中国传统文化——“女书文化”而诞生的女性礼仪相关品牌。 “女书文化”的发展、传承及其为符号承载的文化信息构成了女书风俗......</p> <span>坚持口碑营销用成长说话，内外兼修、优雅绽放！</span><br/> <a href="/pinpaijieshao/" title="查看更多"><img src="/statics/images/ckgd.png" /></a> </div> </div> </body> </html>