怎么用div+css做出一个一模一样的

帮顶

帮顶

花了一点时间仿了一下，软件图标懒得找，就空着了
这是html部分的代码：
<div>
<h3>设计必备软件</h3>
<ul>
<li>
<img src="" />
<p class="list-title">photoshop cs6 简体中文</p>
<p class="list-text">网页设计出效果图、处理图片必备</p>
</li>
<li>
<img src="" />
<p class="list-title">dreamweaver cs6 简体中文</p>
<p class="list-text">网页制作，html、css、程序</p>
</li>
<li>
<img src="" />
<p class="list-title">firefox火狐浏览器</p>
<p class="list-text">测试兼容性用，相对标准的浏览器</p>
</li>
<li>
<img src="" />
<p class="list-title">IEtester</p>
<p class="list-text">IE各版本集成工具，测试兼容用</p>
</li>
<li>
<img src="" />
<p class="list-title">flashfxp FTP上传下载工具</p>
<p class="list-text">往服务器上上传下载数据</p>
</li>
<li>
<img src="" />
<p class="list-title">文件比较工具</p>
<p class="list-text">标示出两个文件哪些地方不同</p>
</li>
<li>
<img src="" />
<p class="list-title">硕思闪客精灵</p>
<p class="list-text">将swf转换为flash格式或提取元素</p>
</li>
</ul>
</div>
这是css部分的代码：
div{width:250px;background-color:#F8F8F8;border:2px solid #E5E5E5;}
ul,h3,p{padding:0;margin:0;}
h3{font-size:14px;color:#777;border-bottom:1px solid #DEDEDE;padding:6px;}
ul{list-style:none;}
li{margin:8px 15px;}
img{float:left;width:34px;height:34px;margin-right:4px;}
.list-title{color:#2255AB;font-weight:bold;font-size:14px;margin-bottom:3px;}
.list-text{font-size:12px;color:#9A9A9A;}