HTML实战案例3：制作易趣网商品列表页面

实战案例3：制作易趣网商品列表页面一、完整的页面效果图二、代码展示<!DOCTYPE html><html><head><meta charset="utf-8"><title>易趣网商品列表</title></head><body><p><img src="images/heade

seafish-why

2738人浏览 · 2021-05-27 16:38:39

seafish-why · 2021-05-27 16:38:39 发布

实战案例3：制作易趣网商品列表页面

一、完整的页面效果图

二、代码展示

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>易趣网 商品列表</title>
</head>

<body>
<p><img src="images/header.jpg" /></p>
<p>首页 &gt; 中国馆 &gt; 女装/女士精品 &gt; 所有商品</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>
	<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>
	<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 &copy; xxxx 易趣版权所有</p>
</body>
</html>

注：其中全部图片存放在文件夹images下