1200字范文 > DIV布局——粉色的鲜花礼品电商(4页) HTML+CSS+JavaScript 学生网上商城网页设计作

DIV布局——粉色的鲜花礼品电商(4页) HTML+CSS+JavaScript 学生网上商城网页设计作

时间：2023-01-05 07:07:04

HTML5期末大作业

文章目录

HTML5期末大作业一、作品展示二、文件目录三、代码实现

一、作品展示

二、文件目录

三、代码实现

<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Author" content="邓裕朋"><meta name="Keywords" content="Ecshop商城开发"><meta name="Description" content="一个月开发商城——邓裕朋"><title>echsop商城首页</title><link href="css/basic.css" style="text/css" rel="stylesheet"><link href="css/web.css" style="text/css" rel="stylesheet"></head><style type="text/css"></style><body><div id="TopMain"><div id="Top"><a href="" class="adv" target="_blank"><img src="images/adv.jpg" /></a><img src="images/close.png" class="close" /></div><div id="Header"><div class="Logo"><a href=""><img src="images/logo.png"></a></div><div class="Search"><form action="" method=""><input type="text" class="Sea" /><input type="submit" class="But" value="" /></form></div><div class="User"><span>您好，dyp123,欢迎你回来! <a href="">用户中心</a>|<a href="">退出</a></span><font class="iconfont"></font><a href="">加入购物车</a></div></div></div><div id="Logo"><ul><li class="frist"><font class="iconfont"></font>全部商品分类<div class="Menu"><ol><li><h3>节日礼物</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li><li><h3>生日礼物</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li><li><h3>蛋糕</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li><li><h3>商务礼物</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li><li><h3>节个性定制</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li><li><h3>鲜花</h3><p><a href="">生日</a><a href="">表白</a><a href="">订婚</a><a href="">结婚</a></p><div class="moreNav"></div><div class="border_top"></div><div class="border_bottom"></div><div class="border_right"></div></li></ol></div></li><li><a href="">首页</li><li><a href="">节日礼物</a></li><li><a href="">生日礼物</a></li><li><a href="">蛋糕</a></li><li><a href="">商物礼物</a></li><li><a href="">个性定制</a></li><li><a href="">鲜花</a></li><li class="last"></li></ul></div><div id="Part1"><div class="PartCon"><div class="news"><div class="newsOpacity"></div><div class="newsCon"><div class="newsKx"><h3>最新快讯</h3><ul><li><a href="" class="frist"><font>[ 特惠 ]</font> 1月1店庆趴爆品嗨抢</a></li><li><a href=""><font>[ 公告 ]</font>“让爱飘香”公益</a></li><li><a href=""><font>[ 特惠 ]</font> 1月1商品全场五折</a></li><li><a href=""><font>[ 特惠 ]</font> 1月1店庆趴爆品嗨抢</a></li><li><a href=""><font>[ 公告 ]</font>“让爱飘香”公益</a></li></ul></div><div class="newsKx Datatx"><h3>节日提醒</h3><ul><li><a href="" title="[ 6.21 ] 父亲节如何选择礼物"><font>[ 6.21 ] 父亲节</font> 进入专题页</a></li><li><a href="" title="[ 6.21 ] 七夕节如何选择礼物"><font>[ 8.21 ] 七夕</font> 进入专题页</a></li><li><a href="" title="[ 6.21 ] 光棍节如何选择礼物"><font>[ 11.11 ] 光棍节</font> 进入专题页</a></li><li><a href="" title="[ 6.21 ] 光棍节如何选择礼物"><font>[ 11.11 ] 光棍节</font> 进入专题页</a></li></ul></div></div></div><div class="flash"><a href="javascript:void(0)" class="prev"></a><a href="javascript:void(0)" class="next"></a><div class="scroll"><img style="left:0;" src="images/flash1.jpg" /><img src="images/flash2.jpg" /><img src="images/flash3.jpg" /><img src="images/flash4.jpg" /><img src="images/flash5.png" /><img src="images/flash6.jpg" /></div><div class="But"><span></span><span></span><span></span><span></span><span></span><span></span><div></div></div></div><div style="clear:both"></div><div id="Main"><div id="NewProduct"><div class="title"><font class="datexp"></font><span class="new">今日新品</span><span class="data">每天8:00新品特卖</span><span class="go"><font class="gohyp"></font>换一批</span><div style="clear:both"></div><div class="Product"><div class="imgList" style="display:block;"><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/bimg.png" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg_img1.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg_img2.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg19.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg17.jpg" width="200px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl></div><div class="imgList"><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg24.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg27.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg23.jpg" width="190px" height="183px" /></dd><dd><font class="iconfont"></font>共有<font>1000</font>个人购买</dd></dl><dl><dt><font class="iconfont"></font>距离结束:<font>2</font>天<font>16</font>时<font>53</font>分<font>31</font>秒</dt><dd><img src="images/dg26.jpg" width="190px" height="183px" /></dd><font>￥30.0</font></h3></li></ul></div></div></div><div style="clear:both"></div><img src="images/f.jpg" class="fbg" /><div id="Footer2"><dl class="frist"><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl><dt><a href="#">关于我们</a></dt><dd><a href="#">诚聘英才</a></dd><dd><a href="#">品牌入驻</a></dd><dd><a href="#">友情链接</a></dd></dl><dl class="last"><dt>客服在线</dt><dd>4006-600-00</dd><dd> <a href="/msgrd?v=3&uin=1209885250&site=qq&menu=yes" target="_blank"><img src="images/QQ.jpg" /></a></dd></dl><div style="clear:both"></div></div><p class="copy">Copyright © - www. All Rights Reserved 版权所有：武汉亲友有限公司备案号：备13016888号</p><script type="text/javascript" src="js/jquery-2.1.4.min.js"></script><script type="text/javascript" src="js/index.js"></script></body></html>

DIV布局——粉色的鲜花礼品电商(4页) HTML+CSS+JavaScript 学生网上商城网页设计作业成品 web课程设计网页规划与设计计算机毕设网页设计源码

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。