HTML5期末大作业:汽车商城网站设计——汽车商城-功能齐全(42页) 大学生汽车商城网页设计模板代码 网购网页作业成品 汽车商城网站设计成品
常见网页设计作业题材有
个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他
等网页设计题目,A+水平作业
, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
🧡作者主页-更多源码
🧡HTML期末大作业文章专栏
作品介绍
1.网页作品简介
:HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。
2.网页作品编辑
:作品下载后可使用任意HTML编辑软件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++
等任意HTML软件编辑修改网页)。
3.网页作品技术
:Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了logo(源文件),基本期末作业所需的知识点全覆盖。
文章目录
HTML5期末大作业:汽车商城网站设计——汽车商城-功能齐全(42页) 大学生汽车商城网页设计模板代码 网购网页作业成品 汽车商城网站设计成品作品介绍一、作品展示二、文件目录三、代码实现四、学习资料五、更多源码一、作品展示
二、文件目录
三、代码实现
<!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" /><link href="css/common.css" rel="stylesheet" type="text/css" /><link href="css/style.css" rel="stylesheet" type="text/css" /><Link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" /><script src="js/jquery.min.1.8.2.js" type="text/javascript"></script><script src="js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script><script src="js/common_js.js" type="text/javascript"></script><script src="js/footer.js" type="text/javascript"></script><script src="js/jqzoom.js" type="text/javascript"></script><script src="js/layer/layer.js" type="text/javascript"></script><title>保单查询</title></head><body><!--顶部样式--><div id="header_top"><div id="top"><div class="top"><div class="Collection"><em></em><a href="#">收藏我们</a></div><div class="hd_top_manu clearfix"><ul class="clearfix"><li class="hd_menu_tit zhuce" data-addclass="hd_menu_hover">欢迎光临本店!<a href="login.html" class="red">[请登录]</a> 新用户<a href="registered.html" class="red">[免费注册]</a></li><li class="hd_menu_tit list_name" data-addclass="hd_menu_hover"><a href="javascript:" class="hd_menu">我的订单</a><div class="hd_menu_list" style="display: none;"><ul><li><a href="询价订单.html">询价订单</a></li><li><a href="保险订单.html">保险订单</a></li><li><a href="购车订单.html">新车订单</a></li></ul></div></li> <li class="hd_menu_tit" data-addclass="hd_menu_hover"> <a href="保单查询.html">保单查询</a> </li><li class="hd_menu_tit" data-addclass="hd_menu_hover"><a href="网站地图.html">网址导航</a></li><li class="hd_menu_tit list_name" data-addclass="hd_menu_hover"><a href="帮助中心.html" class="hd_menu">帮助中心</a><div class="hd_menu_list" style="display: none;"><ul><li><a href="帮助详细.html">常见问题</a></li><li><a href="知识库.html">知识问答</a></li><li><a href="帮助详细.html">支付方式</a></li><li><a href="#">联系方式</a></li><li><a href="#">配送服务</a></li></ul></div> </li><li class="hd_menu_tit phone_c" data-addclass="hd_menu_hover"><a href="#" class="hd_menu "><i class="icon_phone"></i>手机版</a><div class="hd_menu_list erweima"><ul><img src="images/waixin.png" width="120px" height="120"/><p>扫码关注公众号</p></ul></div> </li></ul></div></div></div><!--栏目--><div class="header relative clearfix"><div class="logo_style"><a href="index.html"><img src="images/logo.png" /><h6 class="pingtai_name">一站式汽车综合服务平台</h6></a></div><div class="middle_style"><div class="Search"><p><select name="" class="select_name"><option value="1">全部</option><option value="2">保险</option><option value="3">商城</option></select><input name="搜索框" type="text" class="text" placeholder="请输入关键字"><input name="" onclick="submit_btn()" type="submit" value="搜索" class="Search_btn"></p><p class="Words">热搜关键字:<a href="搜索.html">大众</a><a href="#">宝马</a><a href="#">太平洋保险</a><a href="#">福特</a><a href="#">本田</a><a href="#">哈佛</a></p></div><ul class="menu_list"><li><a href="index.html" class="menu_name">首页</a></li><li><a href="cars_list.html" class="menu_name">购车 <em class="Arrows_icon"></em></a><div class="Insurance_class"><div class="Condition_selection_style"><div class="navcar clearfix"><div class="label_name">车型:</div><ul><li class="navcar01"><a target="_blank" href="" data-tjposition="4|1">微型车</a></li><li class="navcar02"><a target="_blank" href="" data-tjposition="4|2">小型车</a></li><li class="navcar03"><a target="_blank" href="" data-tjposition="4|3">紧凑型车</a></li><li class="navcar04"><a target="_blank" href="" data-tjposition="4|4">中型车</a></li><li class="navcar05"><a target="_blank" href="" data-tjposition="4|5">中大型车</a></li><li class="navcar06"><a target="_blank" href="" data-tjposition="4|6">大型车</a></li><li class="navcar07" id="auto-header-suv"><a target="_blank" href="">SUV</a> </li><li class="navcar08"><a target="_blank" href="" data-tjposition="4|8">MPV</a></li><li class="navcar09"><a target="_blank" href="" data-tjposition="4|9">跑车</a></li><li class="navcar10"><a target="_blank" href="" data-tjposition="4|10">皮卡</a></li><li class="navcar11"><a target="_blank" href="" data-tjposition="4|11">微面</a></li><li class="navcar12"><a target="_blank" href="" data-tjposition="4|12">电动车</a></li></ul></div> <div class="navcar clearfix"><div class="label_name">价格:</div><ul><li class="Car_prices"><a target="_blank" href="" data-tjposition="">0-5万</a></li><li class="Car_prices"><a target="_blank" href="" data-tjposition="">5万-10万</a></li><li class="Car_prices"><a target="_blank" href="" data-tjposition="">10万-15万</a></li><li class="Car_prices"><a target="_blank" href="" data-tjposition="">15万-20万</a></li><li class="Car_prices"><a target="_blank" href="" data-tjposition="">20万-25万</a></li><li class="Car_prices"><a target="_blank" href="" data-tjposition="">25万-50万</a></li><li class="Car_prices"><a target="_blank" href="">50万以上</a> </li></ul></div><div class="Main_models"><div class="title_name">主打车</div><ul><li><a href="#"><img src="images/products/2.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/3.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/4.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/5.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/6.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/7.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/8.jpg" width="80px"/><h4>汽车名称</h4></a></li><li><a href="#"><img src="images/products/9.jpg" width="80px"/><h4>汽车名称</h4></a></li></ul></div></div><div class="Recommended_Brand"><a href="#" class="mb15"><img src="images/ad_1.jpg" width="100%" height="198px"/></a><a href="#"><img src="images/ad_1.jpg" width="100%" height="198px"/></a></div></div> </li><li><a href="#" class="menu_name">车险<em class="Arrows_icon"></em></a><div class="Insurance_class"><div class="Insurance_class_Insurance"><h3><a href="Insurance.html">太平洋保险</a></h3><p class="jianjie ">又称太平洋保险,简称中国太保或太保,前身是中国太平洋保险公司,成立于1991年5月13日,是经中国人民银行批准设立的全国性股份制商业保险公司。中国太平洋保险以“做一家负责任的保险公司”为使命,以“诚信天下,稳健一生,追求卓越”为企业核心价值观,以“推动和实现可持续的价值增长”为经营理念,不断为客户、股东、员工、社会和利益相关者创造价值,为社会和谐做出贡献。</p><div class="clauseBlock"><img src="images/map01.jpg" width="100%" alt=""><ul class="clauseItemList"><li>? 先赔付,再修车</li><li>? 万元以下赔付,3天到账</li><li>? 结案支付,60秒到账</li></ul></div><div class="clauseBlock"><img src="images/map02.jpg" width="100%" alt=""><ul class="clauseItemList"><li>? 7X24小时</li><li>? 百公里免费非事故</li><li>? 道路救援服务</li></ul></div><div class="clauseBlock"><img src="images/map03.jpg" width="100%" alt=""><ul class="clauseItemList"><li>? 人伤案件安心理赔</li><li>? 上门代收理赔资料</li><li>? VIP客户一站式理赔</li><li>? 理赔进度微信实时查询</li></ul></div></div><div class="Insurance_class_Insurance class_san"><h3><a href="#">中国人民保险</a></h3><p class="jianjie marginleft">中国人民财产保险股份有限公司,07月07日成立,经营范围包括财产损失保险、责任保险、信用保险、意外伤害保险、短期健康保险、保证保险等人民币或外币保险业务等。以"四个一流"为标准,以四化建设为路径,以组织能力持续提升为驱动,加快转变发展方式,着力构建以价值增长为目标的发展模式,以成本管控为手段的盈利模式,</p><div class="w740 clearfix"><div class="rocket png"><p class="simple">简单的"<span class="speed">极速</span>"理赔</p><ul class="posRelative"><li class="hasListIco">先赔付、后修车的“极速”服务</li><li class="hasListIco">免填单证、免事故说明的“双免”服务</li><li class="hasListIco">万元以下案件一小时通知赔付</li></ul></div><div class="umbull png"><p class="simple">人伤无忧理赔更"<span class="speed">安心</span>"</p><ul class="posRelative"><li class="hasListIco">专员现场调解</li><li class="hasListIco">当场通知赔付</li><li class="hasListIco">一次性快速处理</li></ul></div></div><div class="head_right_content"><div class="protection_1 png"><p class="expl_protection">车载货物掉落造成的三者损失</p><p class="bus_protection">商业三者险保障</p></div><div class="protection_2 png"><p class="expl_protection">倒车镜单独损坏、灯具单独损坏</p><p class="bus_protection">车损险保障</p></div></div></div></div></li><li><a href="知识.html" class="menu_name">知识</a></li></ul></div><div class="contacttop_style"><img src="images/phone.png" /><div class="header_mycount"><a href="购物车.html" class="cart_style"><i class="icon_cart"></i>我的购物车<i class="ci-count">0</i></a><a href="用户中心.html" class="user_header_style"><i class="icon_user"></i>我的汽车销售</a></div></div></div></div><!--保单查询--><div class="pages_style Insurance_content "><div class="Narrow_screen"><div class="Details_Add_offer clearfix"><div class="Policy_hints">本站支持车险保单查询,请输入证件号码进行保单查询,用户必须登录才能查询。 请输入1234567890进行下一步操作</div><!--查询--><div class="article_style Policy_inquiries"><div class="title_name">保单查询</div><ul class="Policy_style" id="Policy_inquiries"> <!--<li><input name="" type="text" class="text_add " placeholder="邮箱" data-name="邮箱"></li>--><li><input name="" type="text" class="text_add " placeholder="投保人证件号" data-name="投保人证件号"></li><li class="mt20"><button type="button" class="width-35 btn btn-sm btn-primary" id="login_btn" onclick="Policy_inquiries()">保单查询</button></li></ul></div></div></div></div><!--优势--><div class="Advantage_style"><div class="footerbox"><ul class="clearfix"><li class="clearfix ensure_name"><div class="left_icon"><img src="images/icon_img_17.png" /></div><div class="right_content"><h3>全程购物安全保障</h3><h4>用户消费,资金安全</h4></div></li><li class="clearfix ensure_name"><div class="left_icon"><img src="images/icon_img_07.png" /></div><div class="right_content"><h3>专业汽车销售平台</h3><h4>实体汽车销售企业</h4></div></li><li class="clearfix ensure_name"><div class="left_icon"><img src="images/icon_img_09.png" /></div><div class="right_content"><h3>获得相关认真授权</h3><h4>保险,汽车销售许可</h4></div></li><li class="clearfix ensure_name"><div class="left_icon"><img src="images/icon_img_11.png" /></div><div class="right_content"><h3>24小时服务热线</h3><h4>有问题实时沟通联系</h4></div></li></ul></div></div><!--底部样式--><div class="footer"><div class="footerbox clearfix" ><div class="server_box clearfix"><dl><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></dl><dl><dt>服务承诺</dt><dd><a href="#">免手续费</a></dd><dd><a href="#">超长质保</a></dd><dd><a href="#">协助服务</a></dd></dl><dl><dt>支付方式</dt><dd><a href="#">支付宝</a></dd><dd><a href="#">微信支付</a></dd><dd><a href="#">银联支付</a></dd><dd><a href="#">支付步骤</a></dd></dl></div><div class="weixin_style"><div class="sys_style"><img src="images/waixin.png" width="100px"/><h5>微信公众号</h5></div><div class="sys_style"><img src="images/waixin.png" width="100px"/><h5>微信公众号</h5></div></div> <div class="footer_phone"><img src="images/phone.png" /></div> </div><div class="Copyright"><div class="footerbox">保险业务经营许可证:2609570xxxx0800 xxxxxxxxxx有限公司:440301105759096 粤ICP备1xxxxxxxx号<br /> Copyright ©- 汽车销售汽车服务平台版权所有</div> </div></div></body></html><script>/*******保单查询********/function Policy_inquiries(){var str="";$("#Policy_inquiries input[type$='text']").each(function(n){var date="1234567890";if($(this).val()==""){layer.alert(str+=""+$(this).attr("data-name")+"不能为空!\r\n",{title: '提示框',icon:0,}); return false; } if($(this).val()==date){location.href="保单查询结果.html"; }else{layer.open({type: 1,title: false,area: ['450px', '300px'],closeBtn: 0, //不显示关闭按钮anim: 2,shadeClose: true, //开启遮罩关闭content: '<div class="ts_result_style"><img src="images/kuicon.png" width="128px;" height="128px;"><h3>没有查询到任何信息,请核对输入的信息是否正确。<br>若有任何疑问请拨打:<b>400-123-23445<b></h3></div>'}); }layer.close(index);});}</script>
四、学习资料
~ 关注我,点赞博文~ 每天带你涨知识!
相关问题可以相互学习,可关注↓公Z号 获取更多源码 !
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
五、更多源码
HTML5期末考核大作业源码
* 包含个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他
可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
HTML5期末大作业:汽车商城网站设计——汽车商城-功能齐全(42页) 大学生汽车商城网页设计模板代码 网购网页作业成品 汽车商城网站设计成品