失眠网 > HTML5期末大作业：仿天猫购物网站设计——仿天猫购物商城(7页) 网页设计作业网页制

HTML5期末大作业：仿天猫购物网站设计——仿天猫购物商城(7页) 网页设计作业网页制

时间：2020-09-04 17:13:55

HTML5期末大作业：仿天猫购物网站设计——仿天猫购物商城(7页) 网页设计作业,网页制作作业, 学生网页作业, 网页作业成品, 网页作业模板

常见网页设计作业题材有个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他等网页设计题目,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期末大作业：仿天猫购物网站设计——仿天猫购物商城(7页) 网页设计作业,网页制作作业, 学生网页作业, 网页作业成品, 网页作业模板获取更多源码作品介绍一、作品展示二、文件目录三、代码实现四、获取更多源码五、学习资料六、更多源码

一、作品展示

二、文件目录

三、代码实现

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>购物车页面</title><script src="study/js/jquery/2.0.0/jquery.min.js"></script><link href="study/css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet"><script src="study/js/bootstrap/3.3.6/bootstrap.min.js"></script><link rel="stylesheet" type="text/css" href="study/css/main.css"/><script src="study/js/js/main.js"></script></head><body><nav class="top"><div class="middle"><a href="index.html"><span class="glyphicon glyphicon-home redColor"></span>天猫首页</a><span>喵，欢迎来天猫</span><a href="dl.html">请登录</a><a href="zc.html">免费注册</a><span class="pull-right"><a href="dd.html">我的订单</a><a href="gwc.html"><span class="glyphicon glyphicon-shopping-cart redColor"></span>购物车<strong>0</strong>件</a></span></div></nav><div class="simpleSearchOutDiv"><a href="index.html"><img src="img/site/simpleLogo.png" class="simpleLogo" id="simpleLogo"></a><div class="simpleSearchDiv pull-right"><input type="text" name="keyword" placeholder="平衡车原汁机"><button type="button" class="searchButton">搜天猫</button><div class="searchBelow"><span><a href="产品页面.html">冰箱</a><span>|</span> </span><span><a href="产品页面.html">空调</a><span>|</span> </span><span><a href="产品页面.html">女表</a><span>|</span> </span><span><a href="产品页面.html">男表</a></span></div></div><div style="clear:both"></div></div><div class="cartDiv"><div class="cartTitle pull-right"><span>已选商品 (不含运费)</span><span class="cartTitlePrice">￥0.00</span><button class="createOrderButton" style="background-color: rgb(170, 170, 170);" disabled="disabled">结算</button></div><div class="cartProductList"><table class="cartProductTable"><thead><tr><th class="selectAndImage"><img src="img/site/cartNotSelected.png" class="selectAllItem" selectit="false">全选</th><th>商品信息</th><th>单价</th><th>数量</th><th width="120px">金额</th><th class="operation">操作</th></tr></thead><tbody><tr class="cartProductItemTR" oiid="936" style="background-color: rgb(255, 255, 255);"><td><img src="img/site/cartNotSelected.png" class="cartProductItemIfSelected" oiid="936" selectit="false"><a href="#nowhere" style="display:none"><img src="img/site/cartSelected.png"></a><img src="img/productSingle_middle/3665.jpg" class="cartProductImg"></td><td><div class="cartProductLinkOutDiv"><a class="cartProductLink" href="#nowhere">美国iRobot扫地机器人吸尘器全自动家用智能扫地机650 天猫电器城</a><div class="cartProductLinkInnerDiv"><img title="支持信用卡支付" src="img/site/creditcard.png"><img title="消费者保障服务,承诺7天退货" src="img/site/7day.png"><img title="消费者保障服务,承诺如实描述" src="img/site/promise.png"></div></div></td><td><span class="cartProductItemOringalPrice">￥7580.0</span><span class="cartProductItemPromotionPrice">￥5306.0</span></td><td><div class="cartProductChangeNumberDiv"><span pid="365" class="hidden orderItemStock ">75</span><span pid="365" class="hidden orderItemPromotePrice ">5306.0</span><a href="#nowhere" class="numberMinus" pid="365">-</a><input value="1" autocomplete="off" class="orderItemNumberSetting" oiid="936" pid="365"><a href="#nowhere" class="numberPlus" pid="365" stock="75">+</a></div> </td><td><span pid="365" oiid="936" class="cartProductItemSmallSumPrice">￥5,306.00</span></td><td><a href="#nowhere" oiid="936" class="deleteOrderItem">删除</a></td></tr><tr class="cartProductItemTR" oiid="935" style="background-color: rgb(255, 255, 255);"><td><img src="img/site/cartNotSelected.png" class="cartProductItemIfSelected" oiid="935" selectit="false"><a href="#nowhere" style="display:none"><img src="img/site/cartSelected.png"></a><img src="img/productSingle_middle/8510.jpg" class="cartProductImg"></td><td><div class="cartProductLinkOutDiv"><a class="cartProductLink" href="#nowhere">阔腿裤三件套装女夏装新款大码雪纺时尚休闲气质棉麻九分裤潮</a><div class="cartProductLinkInnerDiv"><img title="支持信用卡支付" src="img/site/creditcard.png"><img title="消费者保障服务,承诺7天退货" src="img/site/7day.png"><img title="消费者保障服务,承诺如实描述" src="img/site/promise.png"></div></div></td><td><span class="cartProductItemOringalPrice">￥235.0</span><span class="cartProductItemPromotionPrice">￥152.75</span></td><td><div class="cartProductChangeNumberDiv"><span pid="809" class="hidden orderItemStock ">17</span><span pid="809" class="hidden orderItemPromotePrice ">152.75</span><a href="#nowhere" class="numberMinus" pid="809">-</a><input value="1" autocomplete="off" class="orderItemNumberSetting" oiid="935" pid="809"><a href="#nowhere" class="numberPlus" pid="809" stock="17">+</a></div> </td><td><span pid="809" oiid="935" class="cartProductItemSmallSumPrice">￥152.75</span></td><td><a href="#nowhere" oiid="935" class="deleteOrderItem">删除</a></td></tr></tbody></table></div><div class="cartFoot"><img src="img/site/cartNotSelected.png" class="selectAllItem" selectit="false"><span>全选</span><div class="pull-right"><span>已选商品 <span class="cartSumNumber">0</span> 件</span><span>合计 (不含运费): </span><span class="cartSumPrice">￥0.00</span><button class="createOrderButton" style="background-color: rgb(170, 170, 170);" disabled="disabled">结算</button></div></div></div><div style="display: block;" class="footer" id="footer"><div class="footer_ensure" id="footer_ensure"><a href="#nowhere"><img src="img/site/ensure.png"></a></div><div class="footer_desc" id="footer_desc"><div class="descColumn"><span class="descColumnTitle">购物指南</span><a href="#nowhere">免费注册</a><a href="#nowhere">开通支付宝</a><a href="#nowhere">支付宝充值</a></div><div class="descColumn"><span class="descColumnTitle">天猫保障</span><a href="#nowhere">发票保障</a><a href="#nowhere">售后规则</a><a href="#nowhere">缺货赔付</a></div><div class="descColumn"><span class="descColumnTitle">支付方式</span><a href="#nowhere">快捷支付</a><a href="#nowhere">信用卡</a><a href="#nowhere">蚂蚁花呗</a><a href="#nowhere">货到付款</a></div><div class="descColumn"><span class="descColumnTitle">商家服务</span><a href="#nowhere">商家入驻</a><a href="#nowhere">商家中心</a><a href="#nowhere">天猫智库</a><a href="#nowhere">天猫规则</a><a href="#nowhere">物流服务</a><a href="#nowhere">喵言喵语</a><a href="#nowhere">运营服务</a></div><div class="descColumn"><span class="descColumnTitle">手机天猫</span><a href="#nowhere"><img src="img/site/ma.png"></a></div></div><div class="clearfix"></div><div id="copyright" class="copyright"><div class="coptyrightMiddle"><div class="white_link"><a href="#nowhere" style="padding-left:0px">关于天猫</a><a href="#nowhere"> 帮助中心</a><a href="#nowhere">开放平台</a><a href="#nowhere"> 诚聘英才</a><a href="#nowhere">联系我们</a><a href="#nowhere">网站合作</a><a href="#nowhere">法律声明</a><a href="#nowhere">知识产权</a><a href="#nowhere"> 廉正举报</a></div><div class="white_link"><a href="#nowhere" style="padding-left:0px"> 阿里巴巴集团</a><span class="slash">|</span><a href="#nowhere"> 淘宝网</a><span class="slash">|</span><a href="#nowhere">天猫 </a><span class="slash">|</span><a href="#nowhere"> 聚划算</a><span class="slash">|</span><a href="#nowhere">全球速卖通</a><span class="slash">|</span><a href="#nowhere">阿里巴巴国际交易市场</a><span class="slash">|</span><a href="#nowhere">1688</a><span class="slash">|</span><a href="#nowhere">阿里妈妈</a><span class="slash">|</span><a href="#nowhere"> 阿里旅行·去啊</a><span class="slash">|</span><a href="#nowhere"> 阿里云计算</a><span class="slash">|</span><a href="#nowhere"> 阿里通信 </a><span class="slash">|</span><a href="#nowhere"> YunOS</a><span class="slash">|</span><a href="#nowhere"> 阿里旅行·去啊</a><span class="slash">|</span><a href="#nowhere"> 万网</a><span class="slash">|</span><a href="#nowhere"> 高德</a><span class="slash">|</span><a href="#nowhere"> 优视 </a><span class="slash">|</span><a href="#nowhere"> 友盟</a><span class="slash">|</span><a href="#nowhere"> 虾米</a><span class="slash">|</span><a href="#nowhere"> 天天动听</a><span class="slash">|</span><a href="#nowhere"> 来往</a><span class="slash">|</span><a href="#nowhere"> 钉钉</a><span class="slash">|</span><a href="#nowhere"> 支付宝 </a></div><div class="license"><span>增值电信业务经营许可证：浙B2-0446</span><span>网络文化经营许可证：浙网文[]0295-065号</span><span>互联网医疗保健信息服务审核同意书浙卫网审【】6号 </span><span>互联网药品信息服务资质证书编号：浙-（经营性）--0005</span><div class="copyRightYear">© - 版权所有</div><div><img src="img/site/copyRight1.jpg"><img src="img/site/copyRight2.jpg"></div></div></div></div></div></body></html>