HTML实战案例3:制作易趣⽹商品列表页⾯实战案例3:制作易趣⽹商品列表页⾯
⼀、完整的页⾯效果图
无动力油水分离器
⼆、代码展⽰
<!DOCTYPE html>
<html>
<head>脱硝催化剂回收
<meta charset="utf-8">
<title>易趣⽹商品列表</title>
</head>
<body>
<p><img src="images/header.jpg" /></p>
<p>⾸页 > 中国馆 > ⼥装/⼥⼠精品 > 所有商品</p>
<p><img src="images/list_header.jpg" /></p>
<h2>热点推荐</h2>
<dl>
<dt><img src="images/photo_01.jpg" /></dt>
<dd>⼀⼝价:49.00<br />
全国包邮!韩版修⾝长袖T恤打底衫纯棉圆领T恤</dd> </dl>
<p><img src="images/line.gif" /></p>
<dl>
<dt><img src="images/photo_02.jpg" /></dt>
<dd>⼀⼝价:35.00<br />
自动变光电焊面罩2011新款T恤短袖 t恤⼥短袖影⼦熊猫</dd> </dl>
<p><img src="images/line.gif" /></p>
<dl>
t恤制作<dt><img src="images/photo_03.jpg" /></dt>
<dd>⼀⼝价:48.00<br />
钉珠蝴蝶结秋冬背⼼呢料裙911 -4366</dd>
</dl>
<p><img src="images/line.gif" /></p>
<dl>
<dt><img src="images/photo_04.jpg" /></dt>
7-adca<dd>⼀⼝价:88.00<br />
2011 春装新款⼥装假两件拼接修⾝包臀裙洋装长袖连⾐裙</dd> </dl>
<p><img src="images/line.gif" /></p>
<dl>
<dt><img src="images/photo_05.jpg" /></dt>
<dd>⼀⼝价:169.00<br />
卖家推荐 2011春装新款时尚韩版假两件式百褶连⾐裙 0210806 热销款</dd> </dl>
<p><img src="images/line.gif" /></p>
<dl>
<dt><img src="images/photo_06.jpg" /></dt>
<dd>⼀⼝价:98.00<br />
波西⽶亚民族风格扎染珠⽚多穿裙沙滩</dd>
</dl>
无线发射电路<p><img src="images/line.gif" /></p>
<p>Copyright © xxxx 易趣版权所有</p>
</body>
</html>
注:其中全部图⽚存放在⽂件夹images下