200字范文 > HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计

HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计

时间：2019-03-09 14:16:34

HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计作品大学生购物专题网页设计作业模板商店静态HTML网页模板下载

常见网页设计作业题材有个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

🧡作者主页-更多源码

🧡HTML期末大作业文章专栏

作品介绍

1.网页作品简介：HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载，文章页支持手机PC响应式布局。

2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++等任意HTML软件编辑修改网页）。

3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。

文章目录

HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计作品大学生购物专题网页设计作业模板商店静态HTML网页模板下载作品介绍一、作品展示二、文件目录三、代码实现四、学习资料五、更多源码

一、作品展示

二、文件目录

三、代码实现

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>详细页面</title><meta name="keywords" content="[!--pagekey--]" /><meta name="description" content="[!--pagedes--]" /><link href="images/all.css" type="text/css" rel="stylesheet" /><script type="text/javascript" src="js/jquery.js"></script><script type="text/javascript" src="js/myfocus-2.0.1.min.js"></script><script type="text/javascript" src="js/SuperSlide.js"></script></head><body><header><div class="nav"><ul><li class="li1"><a>海</a></li><li class="li2"><a>拼</a></li></ul></div><div class="head"><div class="top"><div class="wrapper"><div class="logo fl"><a href="index.html"><img src="images/logo.png" /></a></div><div class="dl fr"><ul><li>欢迎您,DGL</li><li><a href="">退出</a></li><li><a href="">个人中心</a></li><li><a href="">我的订单</a></li><li><a href="login.html">登录</a></li><li><a href="">注册</a></li></ul><div class="sousuo"><input class="index_srh" name="keyboard" value="请输入您要查找的商品" onBlur="if(this.value=='') this.value='请输入您要查找的商品';" onFocus="if(this.value=='请输入您要查找的商品') this.value='';"><input class="search" type="submit" name="submit" value="搜索"></div></div></div></div><div class="menu"><div class="wrapper"><ul><li class="li1"><a href="piclist.html" class="on">全部分类</a></li><li class="li2"><a href="index.html">首页</a></li><li class="li3"><a href="piclist.html">潮流单品</a></li><li class="li4"><a href="piclist.html">衣服</a></li><li class="li5"><a href="piclist.html">鞋子</a></li><li class="li6"><a href="piclist.html">包包</a></li><li class="li7"><a href="piclist.html">配饰</a></li><li class="li8"><a href="piclist.html">潮流单品</a></li><li class="li9"><a href="piclist.html">衣服</a></li><li class="li10"><a href="piclist.html">鞋子</a></li><li class="li11"><a href="piclist.html">包包</a></li><li class="li12"><a href="piclist.html">配饰</a></li></ul></div></div></div></header><div class="xiangqing"><div class="shangjiaming"><div class="wrapper"><div class="fl left">小Y包袋</div><div class="fr right"><span class="fl"><a href="">+关注本店</a></span><span class="fl">409粉丝</span></div></div></div><div class="sj-wrapper"><div class="sj-logo"><img src="images/shangjia-logo.jpg" /></div><div class="menu"><a href="">首页</a><a href="">多功能</a><a href="">单肩/手提</a><a href="">大包包</a><a href="">小包</a></div><div class="game163 fl"><ul class="bigImg"><li><a href="" target="_blank"><img src="images/pic1.jpg" /></a><h4><a href="" target="_blank">美女玩家猎魔人 Cosplay</a></h4></li><li><a href="" target="_blank"><img src="images/pic2.jpg" /></a><h4><a href="#">《第2次机战OG》魔装机神系机体情报</a></h4></li><li><a href="" target="_blank"><img src="images/pic3.jpg" /></a><h4><a href="#">Dreamhack冬季赛：Hero夺冠香槟狂欢</a></h4></li><li><a href="" target="_blank"><img src="images/pic4.jpg" /></a><h4><a href="#">妹子战丧尸！Bioware王牌画师插画赏</a></h4></li><li><a href="" target="_blank"><img src="images/pic5.jpg" /></a><h4><a href="#">《刺客信条3》简体中文版已送审</a></h4></li><li><a href="" target="_blank"><img src="images/list1.jpg" /></a><h4><a href="#">《上古世纪》中文版截图独家曝光</a></h4></li><li><a href="" target="_blank"><img src="images/list2.jpg" /></a><h4><a href="#">本周精选大湿级Cos欣赏佐助亲吻小樱</a></h4></li><li><a href="" target="_blank"><img src="images/list3.jpg" /></a><h4><a href="#">《斗仙》11月29日封测试玩截图首曝</a></h4></li></ul><div class="smallScroll"><a class="sPrev" href="javascript:void(0)">←</a><div class="smallImg"><ul><li><a><img src="images/pic1.jpg" /></a></li><li><a><img src="images/pic2.jpg" /></a></li><li><a><img src="images/pic3.jpg" /></a></li><li><a><img src="images/pic4.jpg" /></a></li><li><a><img src="images/pic5.jpg" /></a></li><li><a><img src="images/list1.jpg" /></a></li><li><a><img src="images/list2.jpg" /></a></li><li><a><img src="images/list3.jpg" /></a></li></ul></div><a class="sNext" href="javascript:void(0)">→</a></div><div class="pageState"></div></div><div class="jieshao fr"><div class="title">韩版糖果色迷你链条小包</div><div class="by"><div class="fl"><a href=""><img src="images/tx.jpg" /></a></div><div class="fr"><p>辣辣</p><p><span class="b1"> </span><span>你是否也在寻找一款简约却绝不简单的包包，多种色彩多搭配，散发一种低调的时尚感。</span><span class="b2"> </span></p></div></div><div class="jg clearfix"><ul><li><span class="short">价格</span><span class="price red">¥49.28</span><span class="btn">限时5.6折</span><span class="btn">免运费</span></li><li><span class="short">原价</span><span class="yj">￥88.00</span></li><li><span class="short">促销</span><span class="btn">限时折扣</span><span>本商品参与店铺限时5.6折优惠</span></li><li><span class="short"> </span><span class="btn">微信直减</span><span>每日首单使用微信支付立减10元！</span><a href="" class="red">点击查看</a></li><li><span class="short">运费</span><span>包邮</span></li><li><span class="short">销量</span><span>共售出3299件</span></li><li><span class="short">喜欢</span><span>有6789人喜欢该商品</span></li><li><span class="short">评分</span><span class="star"> </span>4.5分（已有<a href="">14人评价</a>，<a href="">2条晒单</a>）</li><li><span class="short">颜色</span><span class="img"><img src="images/1.1.jpg" /></span><span class="img"><img src="images/1.2.jpg" /></span><span class="img"><img src="images/1.3.jpg" /></span></li><li><span class="short">数量</span><span class="jian"></span><span><input type="text" class="num" value="1" /></span><span class="jia"></span></li><li><span class="short">客服</span><span class="border kf">商家客服</span></li></ul></div><div class="btn_box"><div class="fl"><a href="" class="jiaru"><em></em>加入购物车</a><a href="" class="like"><em></em>立刻购买</a></div></div></div><div class="clearfix"></div></div><div class="sj-center sj-wrapper clearfix"><ul><li><a href=""><img src="images/pc_bao_new.png" /></a><p class="da"><a href="">全场免运费</a></p><p><a href="">无最低消费限制</a></p></li><li><a href=""><img src="images/pc_seven_new.png" /></a><p class="da"><a href="">七天无理由退款</a></p><p><a href="">轻松购物有保障</a></p></li><li><a href=""><img src="images/pc_pei_new.png" /></a><p class="da"><a href="">退货补贴运费</a></p><p><a href="">轻松购物有保障</a></p></li><li><a href=""><img src="images/pc_fan_new.png" /></a><p class="da"><a href="">先行赔付</a></p><p><a href="">轻松购物有保障</a></p></li></ul></div><div class="renqi sj-wrapper"><div class="title">人气单品</div><ul><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚<td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">-03-20 10:49:17</td><td align="center" valign="middle">酒红色（升级加强版）新品现货</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">-03-20 10:49:17</td><td align="center" valign="middle">酒红色（升级加强版）新品现货</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">-03-20 10:49:17</td><td align="center" valign="middle">酒红色（升级加强版）新品现货</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">-03-20 10:49:17</td><td align="center" valign="middle">酒红色（升级加强版）新品现货</td></tr></table></ul><ul><div class="shouqian"><dl><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">购物狂狂狂人</a></p><p>包包控的童鞋来这里,价格超实惠,人也很好! Q:170813916,V信:wx480021,更多优惠尽请期待...</p></div><div class="fr">-10-10</div><p class="hf"><a href="">回复</a></p></dd></dl></div></ul></div></div><div class="remai sj-wrapper"><div class="title">本店热卖</div><ul><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">人气必败王万搭款时尚潮流小包可以单肩斜挎</a></p><p class="p2"><em class="em1">¥28.00</em></p><p class="p3">4637人已购买</p></li></ul></div><div class="sj-center sj-wrapper clearfix"><ul><li><a href=""><img src="images/pc_bao_new.png" /></a><p class="da"><a href="">全场免运费</a></p><p><a href="">无最低消费限制</a></p></li><li><a href=""><img src="images/pc_seven_new.png" /></a><p class="da"><a href="">七天无理由退款</a></p><p><a href="">轻松购物有保障</a></p></li><li><a href=""><img src="images/pc_pei_new.png" /></a><p class="da"><a href="">退货补贴运费</a></p><p><a href="">轻松购物有保障</a></p></li><li><a href=""><img src="images/pc_fan_new.png" /></a><p class="da"><a href="">先行赔付</a></p><p><a href="">轻松购物有保障</a></p></li></ul></div></div><footer><div class="foot"><div class="wrapper"><div class="fl left"><p><a href="" class="foot-logo"></a></p><div class="share"><a href="" class="sina"></a><a href="" class="qq"></a><a href="" class="weixin"></a><a href="" class="wap"></a></div><p>增值电信业务经营许可证：浙B2-0349</p><p>© ,All Rights Reserved.</p></div><div class="center fl"><dl class="xiaofei"><dt>获取更新</dt><dd><a href="">邮件订阅</a></dd><dd><a href="">iPhone/Android</a></dd><dd><a href="">美团QQ空间</a></dd><dd><a href="">美团新浪微博</a></dd><dd><a href="">sitemap</a></dd><dd><a href="">RSS订阅</a></dd></dl><dl class="gongsi"><dt>公司</dt><dd><a href="">关于美团</a></dd><dd><a href="">美团承诺</a></dd><dd><a href="">媒体报道</a></dd><dd><a href="">加入我们</a></dd><dd><a href="">法律声明</a></dd><dd><a href="">用户协议</a></dd></dl><dl class="shangjia"><dt>商务合作</dt><dd><a href="">提供团购信息</a></dd><dd><a href="">美团商家营销平台</a></dd><dd><a href="">市场合作</a></dd><dd><a href="">美团联盟</a></dd><dd><a href="">廉正邮箱</a></dd><dd><a href="">moc.nautiem@gnehznail</a></dd></dl><dl class="bangzhu"><dt>用户帮助</dt><dd><a href="">申请退款</a></dd><dd><a href="">查看美团券密码</a></dd><dd><a href="">常见问题</a></dd><dd><a href="">开放API</a></dd><dd><a href="">美团云</a></dd><dd><a href="">反诈骗公告</a></dd></dl></div><div class="youce fr"><div class="ico"></div><p>退款、退换货、查看美团券<br /><em>参考教程，轻松搞定 »</em></p><p class="tel">客服电话：400-660-5335<br />服务时间：每天 9:00 - 22:00</p></div></div><div class="clearfix"></div></div></footer><script src="js/all.js" type="text/javascript"></script></body></html>