首先请老师原谅，我今天没有写那个公文案例，因为我以前学习不精，然后就算写了，也是在有模板的情况下写的。
我现在每天在刻苦学，通过案例在一点一点的学每一块知识。
今天先报告进度：html+css 学完，是通过一个主界面以及注册页面来学。
先给大家看下结果：
用两种方法 1、table 表格便签来实现 2、div+css 实现
分别贴上代码：1、table
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <table width="1300px" align="center"> <tr> <td> <table width="100%"> <tr height="50px"> <td width="33.3%"> <img src="../img/logo2.png" height="47px" alt="" /> </td> <td width="33.3%"> <img src="../img/header.png" height="47px" /> </td> <td width="33.3%"> <a href="#">登录</a> <a href="#">注册</a> <a href="#">购物车</a> </td> </tr> </table> </td> </tr> <tr height="50px"> <td bgcolor="black"> <a href="#"> <font size="4" color="white">首页</font> </a> <a href="#"> <font color="white">手机数码</font> </a> <a href="#"> <font color="white">电脑办公</font> </a> <a href="#"> <font color="white">鞋靴箱包</font> </a> <a href="#"> <font color="white">电用家器</font> </a> </td> </tr> <tr> <td> <img src="../img/1.jpg" width="100%" alt="" /> </td> </tr> <tr> <td> <table width="100%"> <tr height="50px"> <td colspan="7"> <font size="5"> 最新商品 <img src="../img/title2.jpg" alt="" /> </font> </td> </tr> <tr> <td rowspan="2" width="190px" height="500px"> <img src="../img/big01.jpg" height="100%" alt="" /> </td> <td colspan="3" width="555px" height="250px"> <a href="#"><img src="../img/middle01.jpg" width="100%" height="100%" alt="" /></a> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> </tr> <tr> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> </tr> </table> </td> </tr> <tr> <td><img src="../img/ad.jpg" width="100%" alt="" /></td> </tr> <tr> <td> <table width="100%"> <tr height="50px"> <td colspan="7"> <font size="5"> 热门商品 <img src="../img/title2.jpg" alt="" /> </font> </td> </tr> <tr> <td rowspan="2" width="190px" height="500px"> <img src="../img/big01.jpg" height="100%" alt="" /> </td> <td colspan="3" width="555px" height="250px"> <a href="#"><img src="../img/middle01.jpg" width="100%" height="100%" alt="" /></a> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> </tr> <tr> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small03.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small04.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> <td width="185px" height="250px" align="center"> <a href="#"><img src="../img/small05.jpg" alt="" /></a><br /> <a href="#"> <font color="gray">电炖锅</font> </a> </a><br /><br /> <font color="red">￥499</font> </td> </tr> </table> </td> </tr> <tr> <td><img src="../img/footer.jpg" width="100%" alt="" /></td> </tr> <tr> <td align="center"> <font> <a href="#">关于我们</a> <a href="#">联系我们</a> <a href="#">招贤纳士</a> <a href="#">法律声明</a> <a href="#">友情链接</a> <a href="#">支付方式</a> <a href="#">配送方式</a> <a href="#">服务声明</a> <a href="#">广告声明</a> <br /><br /> Copyright ©2005-2016传智商城 版权所有 </font> </td> </tr> </table> </body> </html>
2、div+css
(稍等，马上就贴）
主要遇到的问题是：
1、标签的使用规则，就是哪个标签不能嵌套哪个
2、遇到问题需要查询手册对应的标签，我相信通过熟练的运用，会一点一点熟悉的