在为m8疯狂的期间，也接到扒饭网管理员小R的邀请，希望能为扒饭网软件中心做形象设计，当时正是在JSP课程设计，因为项目催得急，软件中心也要上线，于是就快速的完成了一个简单的demo，这次还是跟老伙伴龙神在天同学一起完成的。由于和死龙不是在一起工作，所以这次是真正意义上的代码与页面分离。做设计的时候，由于自己有些程序基础，所以写注释的时候，都写得很到位，以致完成html和CSS后，传给龙神同学，得到他大力的赞许。看来，我们2个已经很有默契了。

设计图：

看看首页头部的注释代码：

<!--Header Start--> 
<div id="header"> 
    <div class="clear"></div> 
    <div id="webtitle">m8fans.com 软件下载频道</div><div id="header-ads">Your ADS place, R</div> 
    <div class="clear"></div> 
    <div id="nav"> 
        <ul class="navul"> 
            <!--Nav Loop Start--> 
            <li><a accesskey="a" href="index.html" target="_self">下载首页</a></li> 
            <li><a accesskey="c" href="cate.html">测试栏目</a></li> 
            <li><a accesskey="d" href="#">测试栏目</a></li> 
            <li><a accesskey="e" href="#">测试栏目</a></li> 
            <li><a accesskey="f" href="#">测试栏目</a></li> 
            <li><a accesskey="g" href="#">测试栏目</a></li> 
            <li><a accesskey="h" href="#">测试栏目</a></li> 
            <!--Nav Loop End--> 
        </ul> 
     
    </div> 
</div> 
<!--Header End--> 

软件分类代码

<div id="secate-right-out" class="dashbox"> 
        <div id="secate-right" class="dashBorder"> 
            <table  id="DataRepeater" width="641" border="0" cellspacing="1" cellpadding="1"> 
  <tr> 
    <th width="362" scope="col">软件名</th> 
    <th width="131" scope="col">更新时间</th> 
    <th width="138" scope="col">软件大小</th> 
  </tr> 
  <!--Soft Loop start--> 
  <tr class="drc"> 
    <td class="drl"><a href="soft.html" target="_self" >M8 蓝牙，RMVB的破解补丁</a></td> 
    <td>2008-12-29</td> 
    <td>12.8M</td> 
  </tr> 
<tr class="drc-intro"> 
    <td colspan="3" ><p>专门用于破解M8的手机上RMVB，和蓝牙的补丁！专门用于破解M8的手机上RMVB，和蓝牙的补丁！专门用于破解M8的手机上RMVB，和蓝牙的补丁！专门用于破解M8的手机上RMVB，和蓝牙的补丁！专门用于破解M8的手机上RMVB，和蓝牙的补丁！</p></td> 
    </tr> 
<!--Soft Loop End--> 

目前还很粗糙，等有空会设计出第二版的下载中心！

扒饭网软件下载中心：http://down.m8fans.com