html：
<div id="MainBody"><!--主体内容层-->
<div id="top"><!--上部主体内容层-->
<div id="img"><!--图片-->
<ul>
<li><a href="#"><img src="image/img1.PNG" width="163" height="124" class="a"/></a></li>
<li><a href="#">点击看大图</a></li>
</ul>
</div>
<div id="leaflet"><!--说明-->
<ul>
<li>风格名称：Red vision</li>
<li>设计作者：郑木头</li>
<li>CSS制作：番茄红了</li>
<li>制作时间：2005/11/04</li>
<li>演示地址：<a href="#"> http://www.tblog.com.cn </a></li>
<li>风格简介：此风格设计来自网友"郑木头"，由PJBLOG团队<br/>(番茄红了、舜子)共同完成，在此感谢"郑木头"<br/>提供的设计风格 </li>
<li ><a href="#"><img src="image/download.PNG" class="a" /> 点击下载该风格</li>
</ul>
</div>
</div>
<hr id="hr"/>
<div id="top"><!--下部主体内容-->
<div id="img"><!--图片-->
<ul>
<li><a href="#"><img src="image/img2.PNG" width="163" height="124" class="a"/></a></li>
<li><a href="#">点击看大图</a></li>
</ul>
</div>
<div id="leaflet"><!--说明-->
<ul>
<li>风格名称：Dawn(黎明)</li>
<li>设计作者：番茄红了</li>
<li>CSS制作：番茄红了</li>
<li>制作时间：2005/09/19</li>
<li>演示地址：<a href="#"> http://www.tblog.com.cn </a></li>
<li>风格简介：本SKIN适用于PJBLOG2 V2.3版本。 本SKIN经测试完全兼容IE、Mozilla Firefox浏览器。 建议在1024*768下浏览。</li>
<li ><a href="#"><img src="image/download.PNG" class="a" /> 点击下载该风格</li>
</ul>
</div>
</div>
</div>
css：
@charset "gb2312";
body{
font-size:12px;
text-align:center;
font-family:Tahoma;
margin:0px;
}
a:link,a:visited {
border:0px;
font-size:12px;
color: #000;
text-decoration:none
}
#MainBody{
width:535px;
text-align:left;
float:right;
clear:right;
overflow:hidden;
margin-top:20px;
}
.a{
border:0px;
}
#hr{
border: 1px dashed #ccc;
width: 100%;
height: 1px;
clear:both;
}
#img{
width:162px;
text-align:left;
float:left;
clear:left;
overflow:hidden;
height:150px;
margin-bottom:10px;
border:1px solid #123;
}
#leaflet{
width:370px;
text-align:left;
float:right;
clear:right;
overflow:hidden;
height:150px;
border:1px solid #123;
}
#img ul{
list-style:none;
margin:0px;
padding:0px;
text-align:center;
}
#leaflet ul{
list-style:none; margin:0px;
}
#top{
margin-top:20px;
margin-bottom:20px;}