特点：
两个页头导航条，
中间平铺且居中，
下方页脚两部分，居中在主体下方。
所用到的，之前相关的具体博文：
居中平铺：HTML布局排版2如何设置div总是相对于页面居中、
第二个导航主体嵌入一部分：web排版之主体在页头上嵌入一部分效果、
主体里用table格式化：HTML布局排版之制作个人网站的文章列表、
详细介绍：
1.上下两个渐变条，第二个渐变条切割两块（具体查看上方提到的主体嵌入一部分博文），
2.主体，一个区域切图，上中下三部分拼接，都居中，左右两侧是默认主体的背景色。
3.之前的博文居中那篇，是用的文字居中，文字不居中的时候，为了 避免文字出现在边框图片外，需要左右两侧加padding。
4.页脚紧跟着主体，可比主体宽度小一些，然后也居中，两个内容div左浮动右浮动，这样能不会超出左右两侧。
该模版可根据需要自主修改的地方：
1.主体内容左右padding可根据需要修改，距离主体区域里面的边距-----content1的左右padding。
2.页脚宽度可修改，修改越小，左右两个页脚越紧挨着----footer的width。
3.中间主体图片可更换切片，由于主体头部是透明图，所以可以在不更改渐变的情况下只更改中间切片部分。
所用的图片：（可制作新图片替换）
（平铺的一般用1px，因为是平铺，几px都行）。
第一个渐变（平铺）：切片高度84px，宽1px。
第一个渐变上的高光（透明图）：宽970px，高84px.
第二个渐变上半截（平铺）：切片高度91px，宽1px。
第二个渐变下半截（平铺）：切片高度20px，宽1px。
主体的边框上部分：宽970px,高20px。
主体的中间部分（平铺）：宽970px,高1px。
主体的边框下部分：宽970px，高20px。
模版代码：
<style> body{margin:0px;background-color:#d9d9d9;} #header{width:100%;height:175px;background:url(./images/head_bg.png);} #headertop{width:970px;height:84px;margin:auto;background:url(./images/head_middle3.png);} #headerbottom{width:100%;height:91px;margin:auto;background:url(./images/header_bg91.png);} #body{width:100%;height:100%;background:url(./images/header_bg20.png) repeat-x;} #bodytop{width:970px;height:20px;margin:auto;background:url(./images/body_top.png);} #bodymiddle{width:970px;margin:auto;background:url(./images/body_middle.png);position:relative;} #bodybottom{width:970px;height:20px;margin:auto;background:url(./images/body_bottom.png);} #content1{padding:0 20px 0 20px;} #footer{margin:auto;width:940px;height:110px;} #footer_left{float:left;padding-top:15px;} #footer_right{float:right;padding-top:15px;} </style> <body> <!--页头部分--> <div id="header"> <div id="headertop"></div> <div id="headerbottom"></div> </div> <!--主体部分--> <div id="body"> <div id="bodytop"></div> <div id="bodymiddle"> <div id="content1">内容区<br>dddd<br>ddddd<br>dddd<br>dddd</div> </div> <div id="bodybottom"></div> </div> <!--页脚部分--> <div id="footer"> <div id="footer_left">xxxxxxx号</div> <div id="footer_right">联系方式xxxxx</div> </div> </body>
图示：
