购物网站基本上可以分为下面几个部分。
- 头部：相当于网站的品牌，可用于放置Logo标志和通往各个页面的链接等。
- 内容：放置页面的主体内容。
- 底部：放置页面其他链接和版权信息等。
本案例网站也不例外，首先把网站的主体结构用<div>标签表示出来，<div>标签的id属性值分别为header、content和footer，HTML代码如下所示：
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Letao</title> </head> <body> <!--头部--> <div id="header"></div> <!--主体--> <div id="content"></div> <!--底部--> <div id="footer"></div> </body> </html>
这是一个通用的模板，网站首页(index.html )和产品详细页(detail.html )都可以使用该模板。有了这个基本的结构后，接下来的工作就是把相关的内容分别插入到各个页面。