HTML5期末大作业：绿色特产商城网站设计——绿色特产商城购物网(11页) HTML+CSS+JavaScript 网页设计作业,网页制作作业, 学生网页作业, 网页作业成品, 网页作业模板 ,网页作业定制
常见网页设计作业题材有
个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
作品介绍
1.网页作品简介 ：HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载，文章页支持手机PC响应式布局。
2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页）。
3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。
文章目录
- HTML5期末大作业：绿色特产商城网站设计——绿色特产商城购物网(11页) HTML+CSS+JavaScript 网页设计作业,网页制作作业, 学生网页作业, 网页作业成品, 网页作业模板 ,网页作业定制
- 作品介绍
- 一、作品展示
- 二、文件目录
- 三、代码实现
- 四、学习资料
- 五、更多源码
一、作品展示
二、文件目录
三、代码实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>本亲生活网</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script src="script/global.js" type="text/javascript"></script>
<script src="script/head.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<link rel="stylesheet" type="text/css" href="css/basic.css">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" href="style/base.css" />
<link rel="stylesheet" href="style/head.css" />
<body>
<!--抬头开始-->
<div class="top">
<div class="top1">
<div class="top1_main"><span class="dl">您好，欢迎光临本亲生活网！<a href="denglu.html"> [请登录]</a> <a href="zhuce.html">[免费注册]</a></span><span class="yh_zx"><a href="hyzx.html">用户中心</a> | <a href="#">我的订单</a> | <a href="#">帮助中心</a> | <a href="#">联系方式</a></span></div>
</div>
<div class="top_logo">
<div class="logo"><a href="index.html"><img src="images/logo.jpg" width="338" height="113" / alt="本亲生活的logo标志"></a></div>
<div class="top_you">
<div class="ss_1"><input name="key" type="text" id="key" value="请输入您要搜索的产品" size="30"
οnclick="if(value==defaultValue){value='';this.style.color='#898b8c'}"
onBlur="if(!value){value=defaultValue;this.style.color='#999'}" style="color:#999; line-height:26px;" / class="ssk1"><input name="" value="搜 索" type="button" / class="button1"></div>
</div>
</div>
</div>
<!--抬头结束-->
<!--导航开始-->
<div class="headNav">
<div class="navCon w1020">
<div class="navCon-cate fl navCor"></div>
<dl>
<dt>酒种</dt>
<dd> <a href="#">白兰地</a> <a href="#">伏特加</a> <a href="#">朗姆酒</a> <a href="#">力娇酒</a> <a href="#">墨西哥烈酒</a> <a href="#">甜酒</a> <a href="#">威士忌</a> <a href="#">金酒</a> <a href="#">利口酒</a> </dd>
</dl>
<div class="fn-clear"></div>
</ul>
<ul class="itemright">
<dl>
<dt>促销信息</dt>
</dl>
<div class="news-list">
<p> <span class="red">[威士忌]</span> <a href="#">芝华士，月销万瓶！</a> </p>
</div>
<dl>
<dt>促销活动</dt>
</dl>
<div class="ad-list mt10"> <a href="#"><img src='http://img0.gjw/famous/2013/1115/51ee0f88c7664b099526214a45076686.jpg' width='210' height='100' /></a> <a href="#"><img src='http://img0.gjw/famous/2013/1115/0815723969be40cb8126353991470fb1.jpg' width='210' height='100' /></a> <a href="#"><img src='http://img0.gjw/famous/2013/1115/ce2c2e1eae804529b68785bfd92f5a44.jpg' width='210' height='100' /></a> </div>
</ul>
</div>
</li>
<li >
<div class="cate-tag"> <strong><a href="#">黄酒</a></strong>
<div class="listModel">
<p> <a href="#">石库门</a> <a href="#">女儿红</a> <a href="#">古越龙山</a> </p>
</div>
</div>
<div class="list-item hide">
<ul class="itemleft">
<dl>
<dt>品牌</dt>
<dd> <a href="#">石库门</a> <a href="#">和酒</a> <a href="#">古越龙山</a> <a href="#">女儿红</a> <a href="#">沙洲优黄</a> <a href="#">会稽山</a> <a href="#">塔牌</a> <a href="#">乌毡帽</a> <a href="#">唐宋黄酒</a> <a href="#">钱塘人家</a> <a href="#">咸亨黄酒</a> <a href="#">嘉善黄酒</a> <a href="#">绍兴师爷</a> <a href="#">梁祝</a> <a href="#">组合装</a> </dd>
</dl>
<div class="fn-clear"></div>
<dl>
<dt>年份</dt>
<dd> <a href="#">100年</a> <a href="#">10年</a> <a href="#">12年</a> <a href="#">15年</a> <a href="#">18年</a> <a href="#">20年</a> <a href="#">25年</a> <a href="#">30年</a> <a href="#">3年</a> <a href="#">5年</a> <a href="#">6年</a> <a href="#">8年</a> <a href="#">9年</a> <a href="#">常规年份</a> </dd>
</dl>
<div class="fn-clear"></div>
</ul>
<ul class="itemright">
<dl>
<dt>促销活动</dt>
</dl>
<div class="ad-list mt10"> <a href="#"><img src='http://img0.gjw/famous/2013/1108/c58fc62653c64cfb8e7b93ce34733535.jpg' width='210' height='100' /></a> <a href="#"><img src='http://img0.gjw/famous/2013/1108/ee9514f6a1c341efb0889917e51072af.jpg' width='210' height='100' /></a> </div>
</ul>
</div>
</li>
<li >
<div class="cate-tag"> <strong><a href="#">保健酒与啤酒</a></strong>
<div class="listModel">
<p> <a href="#">百威</a> <a href="#">青岛</a> <a href="#">喜力</a> <a href="#">劲酒</a> </p>
</div>
</div>
<div class="list-item hide">
<ul class="itemleft">
<dl>
<dt>品牌</dt>
<dd> <a href="#">百威</a> <a href="#">喜力</a> <a href="#">青岛</a> <a href="#">劲酒</a> <a href="#">黄金酒</a> <a href="#">蓝莓酒</a> <a href="#">银杏</a> <a href="#">春生堂</a> <a href="#">张裕酒</a> <a href="#">丹力</a> <a href="#">桂花酒</a> <a href="#">森林大猫</a> <a href="#">卡力特</a> <a href="#">麒麟</a> <a href="#">凯撒</a> <a href="#">修士</a> <a href="#">黑森马蹄</a> <a href="#">威兰仕</a> <a href="#">科罗娜</a> <a href="#">蓝带</a> <a href="#">布格福斯</a> <a href="#">博瑞克</a> <a href="#">力兹堡</a> <a href="#">嘉士伯</a> <a href="#">美名格</a> <a href="#">阿登堡</a> <a href="#">博德</a> <a href="#">德福堡</a> <a href="#">德力士</a> <a href="#">朗克</a> <a href="#">麦德奥黑</a> <a href="#">威欧</a> <a href="#">威斯玛</a> <a href="#">朝日</a> <a href="#">彼乐</a> <a href="#">白鹳</a> <a href="#">德博</a> <a href="#">庄园主</a> <a href="#">德拉克</a> <a href="#">西藏青稞</a> </dd>
</dl>
<div class="fn-clear"></div>
</ul>
<ul class="itemright">
<dl>
<dt>促销活动</dt>
</dl>
<div class="ad-list mt10"> <a href="#"><img src='http://img0.gjw/famous/2013/1108/882341974a8543cf93f2a7d18ff277ab.jpg' width='210' height='100' /></a> </div>
</ul>
</div>
</li>
<li>
<div class="float-list-dnav"> </div>
</li>
</ul>
</div>
</div>
<div class="navCon-menu fl">
<ul>
<li><a class="curMenu" href="index.html">商城首页</a></li>
<li><a href="tplist.html">特色产品</a></li>
<li><a href="tplist.html">VIP专区</a></li>
<li><a href="#">服务支持</a></li>
<li><a href="newslist.html">相关资讯</a></li>
<li><a href="about.html">关于本亲</a></li>
</ul>
</div>
</div>
</div>
<!--导航结束-->
<!--会员注册开始-->
<div class="huiyuan_zc">
<div class="zhuce_1">邮箱注册</div>
<div class="zhuce_2">
<div class="zhuce_left">
<div class="yhm_zc">常用邮箱：<input type="text" name="textfield" class="zc_wbk" /></div>
<div class="yhm_zc">输入密码：<input type="text" name="textfield" class="zc_wbk" /></div>
<div class="yhm_zc">再次输入：<input type="text" name="textfield" class="zc_wbk" /></div>
<div class="yhm_zc"><span style="float:left;"> 验证码：<input type="text" name="textfield" class="zc_wbk" / style="width:100px;"></span><span style="float:left; width:132px; height:32px; display:block; margin-left:5px; margin-top:5px;"><img src="images/yzm.jpg" width="120" height="32" /></span><span style="float:left;"><a href="#">看不清，再换一张</a></span></div>
<div class="zhuce_tjxx"><input name="" type="button" value="" οnmοusedοwn="this.style.left='1px';this.style.top='1px';" οnmοuseup="this.style.left='0px';this.style.top='0px';" / style="width:206px; height:35px ; border:none; background: url(images/zhuce_1.jpg); position:relative;"></div>
</div>
<div class="zhuce_right">
<div class="zhuce_right1"><a href="denglu.html"><img src="images/dll.jpg" width="149" height="78" / style="margin-left:50px; margin-top:20px;"></a></div>
<div class="zhuce_right2"><img src="images/bqsy.jpg" width="228" height="209" /></div>
</div>
</div>
</div>
<!--会员注册结束-->
<!--中部开始-->
<div class="con_ny">
</div>
<!--中部结束-->
<!--底部开始-->
<div class="footer_ys">
<div class="footer_ys1"></div>
</div>
<!--软文开始-->
<div class="ruanwen">
<ul>
<li class="da">关于本亲</li>
<li><a href="#">公司简介</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">友情连接</a></li>
</ul>
<ul>
<li class="da">新手指南</li>
<li><a href="#">账户注册</a></li>
<li><a href="#">购物流程</a></li>
<li><a href="#">注册须知</a></li>
</ul>
<ul>
<li class="da">配送范围及须知</li>
<li><a href="#">配送范围</a></li>
<li><a href="#">配送须知</a></li>
<li><a href="#">配送时间</a></li>
</ul>
<ul>
<li class="da">支付方式</li>
<li><a href="#">货到付款</a></li>
<li><a href="#">在线支付</a></li>
<li><a href="#">其他方式支付</a></li>
</ul>
<ul>
<li class="da">售后服务</li>
<li><a href="#">退换货政策</a></li>
<li><a href="#">退换货办理流程</a></li>
<li><a href="#">退款说明</a></li>
</ul>
<ul>
<li class="da">帮助说明</li>
<li><a href="#">找回密码</a></li>
<li><a href="#">帮助中心</a></li>
<li><a href="#">隐私声明</a></li>
</ul>
</div>
<!--软文结束-->
<!--友情连接开始-->
<div class="links">
<div class="links_main">友情连接： <a href="#">郑州卓普科技</a> | 本亲生活网 | 郑州卓普科技 | 本亲生活网 | 郑州卓普科技 | 本亲生活网 | 郑州卓普科技 | 本亲生活网 | 郑州卓普科技 | 本亲生活网 | 郑州卓普科技 </div>
</div>
<div class="banquan">Copyright © 2014-2019 All Right Reserved 版权所有：本亲生活网 备案号： 豫ICP 450051256-1号<br />
<div class="banquan2"><img src="images/xinr.jpg" width="589" height="51" /></div>
</div>
<!--友情链接结束-->
<!--底部结束-->
</body>
</html>
<SCRIPT Language=VBScript><!--
//--></SCRIPT>
四、学习资料
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
五、更多源码
HTML5期末考核大作业源码* 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
更多推荐
html静态页面作业——绿色特产商城购物网(11页) HTML+CSS+JavaScript 网页设计作业,网页制作作业, 学生网页作业, 网页作业成品, 网页
发布评论