图文混排，展示策略

思路： 先用dl把图和文字给放入一个区块，然后再浮动dl

<div id="content">
<h1>楼盘展示</h1>
<dl>
<dd><img src="images/pic1.jpg" alt="三盘领海"/></dd>
<dt>三盘领海</dt>
</dl>
<p>共计：5条记录 页次：1/1 每页：5条 上一页/下一页</p>
</div>

<dl>
<dd><dd>
<dt></dt>
<dt></dt>
<dt></dt>
<dt></dt>
<dt></dt>
</dl>

#content dl{
width:250px; ---也可以更大 width:280px ---这样的好处是 使得左右两边的dl有间隔
-----这里的参数是先根据img来设计，比img高和宽，然后下面的算完后，在
-----150px+30px+1px = 181px
height:181px;
float:left;
padding-left:30px; 使得左边间距有25px 这是float时常用的技巧
}

#content dl dd{
width:250px;
height:150px;
}
#content dl dd img{
display:block;
width:250px;
height:150px;
}

#content dl dt{
#width:250px;
#height:30px;
text-align:center;
line-height:30px;
border-bottom:1px solid #f60;
}

#content p {
clear:both; -----清除浮动，使得浮动对他没有效果
padding-top:30px; --- 注意：这时候margin-top已经失效，所以margin 和padding总有一个有效
}