300字范文 > HTML5期末大作业：爱折扣电商购物网站设计——清新爱折扣电商购物网站(5页) HTML+CSS

HTML5期末大作业：爱折扣电商购物网站设计——清新爱折扣电商购物网站(5页) HTML+CSS

时间：2018-10-16 15:59:27

HTML5期末大作业：爱折扣电商购物网站设计——清新爱折扣电商购物网站(5页) HTML+CSS+JavaScript 关于电商的HTML网页设计-----网购

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

获取更多源码

PC电脑端关注我们

🧡作者主页-更多源码

🧡HTML期末大作业文章专栏

作品介绍

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

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

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

文章目录

HTML5期末大作业：爱折扣电商购物网站设计——清新爱折扣电商购物网站(5页) HTML+CSS+JavaScript 关于电商的HTML网页设计-----网购获取更多源码作品介绍一、作品展示二、文件目录三、代码实现四、获取更多源码五、学习资料六、更多源码

一、作品展示

二、文件目录

三、代码实现

<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>会员中心</title><meta name="description" content=""><meta name="keywords" content=""><link href="css/style.css" rel="stylesheet" type="text/css" /><link href="css/member.css" rel="stylesheet" type="text/css" /><script src="js/jquery.min.js" type="text/javascript"></script></head><body><div class="header"><div class="topbar"><span><a href="#">QQ登录</a></span><span><a href="#">微博登陆</a></span> <span class="hr-line">|</span><span class="item"><a href="#">登录</a></span><span class="item"><a href="#">注册</a></span> <span class="hr-line">|</span><span class="orange"><a href="#">积分签到</a></span></div><div class="headbox"><div class="logo"><img src="image/logo.png" /></div><div class="searchbox"><div class="tips-num gray">今日更新 <span class="green">298</span> 款</div><form id="submitform"><input id="searchText" type="text" class="text gray" value='今秋"时尚"看我的，国庆出门美美的' onFocus="if (this.value==this.defaultValue) this.value='';" onblur="if (this.value=='') this.value=this.defaultValue;"/><input id="searchSubmit" type="submit" value=""/></form><div class="tipswrap"><div class="tipsbox"><a href="#" /><img src="image/tips-icon1.jpg" /></br><span class="gray">看过</span></a></div><span class="gray">|</span><div class="tipsbox"><a href="#" /><img src="image/tips-icon2.jpg" /></br><span class="gray">收藏</span></a></div></div><div class="clear"></div></div></div><div class="nav"><ul><li class="font16"><a href="#">首页</a></li><li class="mline m9m30"></li><li class="font16"><a href="#">逛街</a></li><li class="mline m9m30"></li><li class="font16"><a href="#">9.9抢购</a></li><li class="mline m9m30"></li><li class="font16"><a href="#">20元封顶</a></li><li class="mline m9m30"></li><li class="font16"><a href="#">主题购</a></li><li class="mline m9m30"></li><li class="font16"><a href="#">免费申领</a></li></ul></div></div><div class="banner-wrap"><div class="banner"><div class="userface fl"><img src="image/member/userface.png"></div><div class="userinfo fl"><div><h2>honey娟</h2><a href="#"/>设置</a></div><div class="font14 grayer"><span>女</span><span class="mline m0m15"></span><span>天蝎座</span><span class="mline m0m15"></span><span>四川-成都</span></div><p class="tabtext grayer pt35">People don't leave because things are hard. People do leave because it's no longer worth it.</p></div><div class="useratten fl"><ul class="clear"><li><a href="#"><strong class="grayer">600</strong><span>积分</span></a></li><li><a href="#"><strong class="orange">1128</strong><span>粉丝</span></a></li><li style="border:none"><a href="#"><strong class="grayer">600</strong><span>关注</span></a></li></ul></div><div class="clear"></div></div></div> <div class="container pb"><div class="subnav"><ul><li>主页</li><li class="bgorange white">喜欢</li><li>最近</li><li class="bgyellow white">消息</li><li>我的爆料</li><li>邀请好友</li></ul></div><div class="column pb50"><div class="colwrap"><div class="dress"><div class="dresspic"><a href="#"><img src="image/member/image1.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><span>删除</span></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress"><div class="dresspic"><a href="#"><img src="image/member/image1.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress"><div class="dresspic"><a href="#"><img src="image/member/image2.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress" style="margin-right:0;"><div class="dresspic"><a href="#"><img src="image/member/image3.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress mt" ><div class="dresspic"><a href="#"><img src="image/member/image4.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress mt"><div class="dresspic"><a href="#"><img src="image/member/image3.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress mt"><div class="dresspic"><a href="#"><img src="image/member/image4.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="dress mt" style="margin-right:0;"><div class="dresspic"><a href="#"><img src="image/member/image2.png"></a></div><div class="dressprice"><div class="sl"><a href="#" class="orange"><h3>￥</h3><h1>27.0</h1></a></div><div class="sr"><a href="#" class="orange">删除</a></div><div class="clear"></div></div><div class="dressdetail"><span class="sl"><a href="#">minusl旗舰店</a></span><span class="sr"><em class="orange">4795</em>人已开抢</span></div></div><div class="clear"></div> </div><div class="colwrap">喜欢</div><div class="colwrap">最近</div><div class="colwrap">消息</div><div class="colwrap">我的爆料</div><div class="colwrap">邀请好友</div></div><div class="clear"></div></div><div class="footer"><div class="findbox"><div class="find font16"><span class="pt10">发现</span></div></div><div class="footbox"><div class="about"><div class="font16 abtitle">关于我们</div><ul class="gray"><li>爱打折简介</li><li>联系我们</li><li>加入我们</li></ul></div><div class="cooper"><div class="font16 abtitle">关于我们</div><ul class="gray"><li>爱打折简介</li><li>联系我们</li><li>加入我们</li></ul> </div><div class="weixin"><div class="wxlogo"><img src="image/logo.png"></div><div class="wxpic"></div></div><div class="cooper" style="border-right:1px dotted #CCC;"><div class="font16 abtitle">商务合作</div><ul class="gray"><li>爱打折简介</li><li>联系我们</li><li>加入我们</li></ul></div><div class="about" style="border:none;"><div class="font16 abtitle">帮助中心</div><ul class="gray"><li>爱打折简介</li><li>联系我们</li><li>加入我们</li></ul></div></div><div class="copyright gray">Copyright © Phoenix New Media Limited All Rights Reserved.</div></div> <script type="text/javascript">$(".subnav ul li").click(function(){$(".column .colwrap").hide().eq($(this).index()).show();});</script></body></html>