HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript 期末作业HTML代码 学生网页课程设计期末作业下载 web网页设计制作成品


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



>>>???? 点击进入???? >>>300例HTML期末大作业源码



1.临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手? 网页要求的总数量太多?
2.没有合适的模板?等等一系列问题。你想要解决的问题,在这篇博文中基本都能满足你的需求~
3.原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,这是一个不错的网页制作,画面精明,非常适合初学者学习使用。


作品介绍

1.网页作品简介​​ :HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。包含:​​主页、关于我们、登录、注册,​​总共4个页面。

2.网页作品编辑​​:此作品为学生期末大作业网页设计题材,代码为简单学生水平 html+css 布局制作,作品下载后可使用任意HTML编辑软件(例如:​​DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++​​ 等任意HTML软件编辑修改网页)。

3.网页作品布局​:网页布局整体为响应式布局、LOGO、导航、主体内容布局。子页面多种布局,兴趣爱好内容使用图片列表布局,成绩页面插入了表格,联系我们使用图片对齐方式设置了左对齐。

4.网页作品技术​:使用DIV+CSS制作网页, 背景图、音乐、视频、flash、鼠标经过及选中导航变色效果、下划线 、等。 表单提交、评论留言,并使用JavaScript制作了表单判断(提交时表单不能为空)。


文章目录


一、作品展示

1.首页

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_css

2.海鲜系列

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_css_02

3.联系我们

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_javascript_03

4.人才招聘

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_d3_04

5.公司简介

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_html5_05

二、文件目录

HTML5期末大作业:餐饮网站设计——食品餐饮行业网站模板(10页) HTML+CSS+JavaScript web网页设计制作成品_html5_06

三、代码实现

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XXX_关于XXX</title>
<link rel="stylesheet" type="text/css" href="style/slf.css"/>
<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/banner.index.js"></script>
<script type="text/javascript" src="js/jquery.easing.js"></script>
<script type="text/javascript" src="js/slf.js"></script>
<script src="js/swiper.jquery.js"></script>
</head>

<body>
<div class="gray">
<div id="headr"> <a href="#" class="logo"><img src="images/logo.jpg" width="88" height="100" alt=""/></a>
<ul id="nav">
<li><a href="index.html">首页</a></li>
<li><a href="about.html">关于XXX</a></li>
<li><a href="news.html">新闻中心</a></li>
<li><a href="products.html">产品中心</a></li>
<li><a href="#">联系方式</a></li>
<li><a href="zhaopin.html">在线招聘</a></li>
<div class="clear"></div>
</ul>
</div>
</div>
<div class="zhaopinBanner"></div>
<div class="main3">
<div class="nyTit">
<div class="cn">人才招聘</div>
<div class="en">SOCIAL RECRUITMENT</div>
</div>

<!--二级菜单-->
<div class="nyCon">
<ul class="tbHire">
<li class="zhaopin">
<div class="td1">职位名称</div>
<div class="td2">工作地点</div>
<div class="td3">招聘人数</div>
<div class="td4">发布时间</div>
<div class="td5">截止时间</div>
<div class="td6">在线招聘</div>
</li>
<li>
<div class="td1"><a href="zhaopinshow.html">研发经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">销售主管</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域销售经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域人力资源专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">客服专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">平面设计</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">研发经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">销售主管</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域销售经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域人力资源专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">客服专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">平面设计</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">研发经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">销售主管</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域销售经理</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">区域人力资源专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">客服专员</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<li>
<div class="td1"><a href="#">平面设计</a></div>
<div class="td2">武汉市东西湖区</div>
<div class="td3">2人</div>
<div class="td4">2015-10-15</div>
<div class="td5">2016-05-15</div>
<div class="td6"><a href="#">查看详情</a></div>
</li>
<div class="clear"></div>
</ul>
</div>
</div>
<div class="bgYellow">
<div class="rootCon">
<div class="tit">树根文化</div>
<div class="bg"></div>
<p> 大树之繁荣,皆因其根!根深则叶茂,根深则茁壮,因此无论风吹雨打,大树始终傲立于天地之间!同理,做企业不是观其规模多大,而是看其抗风险能力有多强,能否可持续发展,<br />
造福万物生灵。企业只有根扎于地下,才能盎然挺拔,生生不息,搏击风雨,基业长青! </p>
</div>
</div>
</div>
<div class="clear"></div>
<div class="footer">
<div class="main2">
<div class="icontact"><span class="f2">contact</span> <span class="f3">for me</span></div>
<div class="tel"> online Service
<div class="telNum">XXX</div>
<div class="box"></div>
<span style="text-transform:normal;">传真:XXX</span> <span style="text-transform: none;">邮箱:XXX</span></div>
<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>
</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>
</dl>
<!-- 二维码 开始 -->
<div class="bgEwm">
<div class="topBg" style="background-image: url(images/topBg.png);"></div>

<!-- 代码 开始 -->
<script type="text/javascript" src="js/zzsc.js"></script>
<div id="box">
<div class="prev"></div>
<div class="next"></div>
<ul class="bigUl">
<li style="z-index:1"><a href="#"><img src="images/ewm1.jpg" alt="图1" /></a></li>
<li><a href="#"><img src="images/ewm1.jpg" alt="图2" /></a></li>
<li><a href="#"><img src="images/ewm2.jpg" alt="图3" /></a></li>
<li><a href="#"><img src="images/ewm1.jpg" alt="图4" /></a></li>
</ul>
<ul class="numberUl">
<li class="night"><a href="javascript:;">1</a></li>
<li><a href="javascript:;">2</a></li>
<li><a href="javascript:;">3</a></li>
<li><a href="javascript:;">4</a></li>
</ul>
<div>
<ul class="textUl">
<li style="display:block;"><a href="#">XXX公众号</a></li>
<li><a href="#">XXX手机二维码</a></li>
<li><a href="#">XXX微商城</a></li>
<li><a href="#">XXX微信号</a></li>
</ul>
</div>
</div>
<!-- 代码 结束 -->
</div>
</div>
</div>
<div class="copyRight">
<div class="copyRightCon">
<p>COPYRIGHT © 2020 ALL RIGHTS RESERVED</p>
</div>
</div>
</body>
</html>





六、更多源码

​????作者博客主页​

​???? 320套HTML期末大作业演示地址​

​???? 150套echarts大数据演示地址​

​????100款告白源码地址​