刚才修改页面div整合时，发现附加图片背景后，明显上下两个div之间有间隙出现，于是低效率又来了……改margin-bottom为0与margin-top为0都不行，囧死……
后来网上搜搜，看了许久，才看到亮点……就是margin改为负值……于是乎，试了一下，真的可以：将上面的div css修改margin-bottom=-18px，然后就把两个div在外观上真实拼接了，
可是随后又出现其他问题，即可能出现使用同一款css，在上一个div底部有内容的情况下，会导致该内容覆盖到下一个div的顶部空间处，一旦两者都有内容，就会重叠……
于是乎，我的做法是在下一个div顶部加若干个<br>……
为啥两个div之间会有间隙呢？
附上代码：
css：
#wrap{
margin:0 auto;
width:1000px;
padding:0px;
font-family: Cochin, Georgia, "New Century Schoolbook", "Bitstream Vera Serif", "Times New Roman", times, serif;
}
#header{
margin:0 auto;
background-image:url(../image/wrap_back_mt1_header.png);
background-repeat:no-repeat;
width:1000px;
clear:both;
}
#header .logo{
padding-top:55px;
margin-left:30px;
height:120px;
background-repeat:no-repeat;
background-position:left;
background-image:url(../image/logoback_meitu.png);
}
.lead{
margin:auto;
width:900px;
height:50px;
border:thick;
background-image:url(../image/nav_back_pic.png);
}
.nav li{
float:left;
text-align:center;
color:#000;
width:78px;
height:27px;
margin-top:11px;
margin-right:1px;
padding:5px;
list-style-type:none;
border:thick;
background-image:url(../image/li_gh.png);
}
.nav a{
text-decoration:none;
}
.nav a li {
}
.nav a:hover li {
background-image:url(../image/li_gn.png);
}
#contentBack{
margin-top:0px;
width:100%;
background-image:url(../image/wrap_back_mt1_block.png);
background-repeat:repeat-y;
}
#content{
margin:0 auto;
width:900px;
clear:both;
}
#comment{
margin:0 auto;
width:900px;
clear:both;
}
#footerBack{
margin-top:0px;
width:100%;
height:200px;
background-image:url(../image/wrap_back_mt1_footer.png);
background-repeat:no-repeat;
}
#footer{
width:900px;
border-top:#000 solid medium;
padding:2px 0px;
margin:0 auto;
height:25px;
border-width:2px;
border-color:#000;
background-color:#CC3;
}
.right{
float:right;
}
.left{
float:left;
}
html Demo：（实际问题在demo源码中）
<!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" xml:lang="zh-cn" lang="zh-cn">
<head>
<title>{$title} - test</title>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
</head>
<body>
<div id="wrap">
<div id="header">
<div class="logo">
</div>
<div class="lead">
<ul class="nav">
<a href="#"><li>home</li></a>
<a href="#"><li>hot home</li></a>
<a href="#"><li>your home</li></a>
<a href="#"><li>mani home</li></a>
</ul>
</div>
</div>
<div id="contentBack">
<!--主体部分-->
<div id="content">
<h1>首页.</h1>
¥
test
find
</div>
</div><!--end of contentBack-->
<div id="footerBack">
<!---->
<div id="footer">
<div class="left">版权归123456所有</div>
<div class="right">BY 123456</div>
</div>
</div>
</div> <!--end of wrap-->
</body>
</html>
之前一直纠结着在div的margin为0却失败的问题，
浏览器默认样式中，h1等标题元素默认拥有一定的margin值，#header和#contentBack之间的空隙，便是由#content中的h1引起的，在chrome中，用审查工具，一看便知！