web前端期末大作业 html+css+javascript 校园主题-萍乡田家炳中学(1页)网页设计成品

本文主要是介绍web前端期末大作业 html+css+javascript 校园主题-萍乡田家炳中学(1页)网页设计成品，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

web前端期末大作业 html+css+javascript 校园主题-萍乡田家炳中学(1页) 网页设计成品

>>>❤戳我❤>>>点击进入300例期末大作业作品

临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~

原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，这是一个不错的网页制作，画面精明，非常适合初学者学习使用。

作品介绍

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

2.网页作品编辑方面：此作品为学生期末大作业网页设计题材，代码为简单学生水平 html+css 布局制作，作品下载后可使用任意HTML编辑软件（例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有编辑器均可使用）

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

4.网页作品技术方面：使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。首页制作了留言表单，同时简单使用JavaScript制作了表单判断（提交时表单不能为空）

文章目录

web前端期末大作业 html+css+javascript 校园主题-萍乡田家炳中学(1页) 网页设计成品
- [>>>❤戳我❤>>>点击进入300例期末大作业作品]( https://ruanjiafeng2013.gitee.io/html-page )
作品介绍
一、作品演示
二、代码目录
三、代码实现
四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
五、源码获取
六、更多HTML期末大作业(成品下载)
- [>>>戳我>>>点击进入主页查看更多源码]( https://blog.csdn.net/ruan365392777?spm=1000.2115.3001.5343 )

一、作品演示

在这里插入图片描述

二、代码目录

在这里插入图片描述

三、代码实现

<!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>无标题文档</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="js/nav.js" type="text/javascript"></script>
</head><body>
<div class="heard">
<div class="top"><div class="logo"><img src="images/logo.jpg" width="398" height="86" /></div>
</div>
</div><div class="rz_bw_nav001_m"><div class="nav"><div class="nav_main"><ul id="nav_all"><li><a href="#">首页</a></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">走进田中</a><ul style="display: none;"><li style="width: 8px;"></li><li><a href="#">学校简介</a></li><li><a href="#">|</a></li><li><a href="#">校园文化</a></li><li><a href="#">|</a></li><li><a href="#">学校机构</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">新闻频道 </a><ul style="display: none;"><li style="width:128px;"></li><li><a href="#">学校新闻</a></li><li><a href="#">|</a></li><li><a href="#">通知公告</a></li><li><a href="#">|</a></li><li><a href="#">校园动态</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#"><div style="_margin-top: 12px;"></div> 教育科研</a><ul style="display: none;"><li style="width: 225px;"></li><li><a href="#">教学园地</a></li><li><a href="#">|</a></li><li><a href="#">校本教研</a></li><li><a href="#">|</a></li><li><a href="#">成果展示</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">德育天地</a><ul style="display: none;"><li style="width: 350px;"></li><li><a href="#">德育案例</a></li><li><a href="#">|</a></li><li><a href="#">心理健康</a></li><li><a href="#">|</a></li><li><a href="#">师德师风</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">党建工作</a><ul style="display: none;"><li style="width: 460px;"></li><li><a href="#">组织机构</a></li><li><a href="#">|</a></li><li><a href="#">群团信息</a></li><li><a href="#">|</a></li><li><a href="#">专题聚焦</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">田园风采 </a><ul style="display: none;"><li style="width: 590px;"></li><li><a href="#">优秀学生</a></li><li><a href="#">|</a></li><li><a href="#">社团活动</a></li><li><a href="#">|</a></li><li><a href="#">学生作品</a></li></ul></li>  <li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">教工之家  </a><ul style="display: none;"><li style="width: 690px;"></li><li><a href="#">政策法规</a></li><li><a href="#">|</a></li><li><a href="#">教工活动</a></li><li><a href="#">|</a></li><li><a href="#">规章制度</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">在线留言  </a><ul style="display: none;"><li style="width: 800px;"></li><li><a href="#">学习交流</a></li><li><a href="#">|</a></li><li><a href="#">师恩墙</a></li></ul></li><li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li><li><a href="#">活动专栏 </a></li> <li class="spale"><img src="images/navbg2.jpg" width="2" height="61" /></li>          </ul></div></div>
</div>
<div class="wap"><div class="banner"><a href="#"><img src="images/a01.jpg" width="1112" height="330" /></a><ul class="futie"><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li></ul></div><div class="main1"><div class="left"><div class="a01"><div class="info"><div class="title">走进田中</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><div class="mnt01"><img src="images/tp01.jpg" width="260" height="186" /></div><div class="mnt02"><div class="bt01"><h1 class="w01"><a href="#">毕业科目教师</a></h1><p class="w02">为了进一步调整，统一目标，确定措施，增加信心，克服困难 为了进一步调整，统一目标，确定措施，增加信心，克服困难</p></div><div class="bt02"><ul class="news1"><li><a href="new_detail.html"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="new_detail.html"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li></ul></div></div></div></div><div class="a02"><div class="news2"><div class="info"><div class="title">教育科研</div><div class="more"><a href="#">MORE+</a></div></div><div class="bt03"><ul class="ne1"><li><a href="new_detail.html"><span>2013-4-13</span>积极参与评价 共建廉洁萍乡</a></li><li><a href="new_detail.html"><span>2013-4-13</span>致学生家长的一封信</a></li><li><a href="#"><span>2013-4-13</span>市九中党风廉政建设目标管理责任状</a></li><li><a href="#"><span>2013-4-13</span>廉政文化进校园活动</a></li><li><a href="new_detail.html"><span>2013-4-13</span>"廉政文化进校园"活动开展情况汇报</a></li><li><a href="new_detail.html"><span>2013-4-13</span>廉政教育主题黑板报</a></li><li><a href="#"><span>2013-4-13</span>形式多样的主题活动</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="new_detail.html"><span>2013-4-13</span>形式多样的主题活动</a></li><li><a href="new_detail.html"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li></ul></div></div><div class="news2" style="margin-left:13px;"><div class="info"><div class="title">新闻频道</div><div class="more"><a href="#">MORE+</a></div></div><div class="bt03"><ul class="ne1"><li><a href="new_detail.html"><span>2013-4-13</span>积极参与评价 共建廉洁萍乡</a></li><li><a href="new_detail.html"><span>2013-4-13</span>致学生家长的一封信</a></li><li><a href="#"><span>2013-4-13</span>市九中党风廉政建设目标管理责任状</a></li><li><a href="#"><span>2013-4-13</span>廉政文化进校园活动</a></li><li><a href="new_detail.html"><span>2013-4-13</span>"廉政文化进校园"活动开展情况汇报</a></li><li><a href="new_detail.html"><span>2013-4-13</span>廉政教育主题黑板报</a></li><li><a href="#"><span>2013-4-13</span>形式多样的主题活动</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="new_detail.html"><span>2013-4-13</span>形式多样的主题活动</a></li><li><a href="new_detail.html"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li><li><a href="#"><span>2013-4-13</span>热烈庆祝公司网站上线</a></li></ul></div></div></div><div class="a03"><div class="info"><div class="title">田园风采</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><div class="mnt03"><img src="images/tp02.jpg" width="156" height="130" /></div><div class="mnt04"><div class="bt04"><a href="#">2015年引进高层次专业人才实施方案</a></div><div class="bt05">6月4日上午，萍乡九中召开党的群众路线教育实践活动查摆问题专题会议，市教育局第七督导组出席指导，学校领导班子成员和部分教师代表参加会议。会上，周新萍校长通报了学校在遵守党的政治纪律，贯彻执行中央八项规定、加强作风建设，"四风"方面存在突出问题，学校意见建议收集等方面的情况，分析了产生问题的原因，提出了今后的努力方向和改进措施。学校领导班子成员和部分教师代表参加会议。会上，周新萍校长通报了学校在遵守党的政治纪律，贯政治纪律，贯彻执行中央八</div></div></div><div class="content1"><ul class="ne2" style="margin-right:40px;"><li><a href="#">"青少年法治课堂暨模拟法庭进校园"</a></li><li><a href="#">"热烈庆祝萍乡市2015年中小学生足"</a></li><li><a href="#">"关于进一步加强工作纪律要求的通知"</a></li></ul><ul class="ne2"><li><a href="#">"青少年法治课堂暨模拟法庭进校园"</a></li><li><a href="#">"热烈庆祝萍乡市2015年中小学生足"</a></li><li><a href="#">"关于进一步加强工作纪律要求的通知"</a></li></ul></div></div><div class="a03"><div class="info"><div class="title">教工之家</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><div class="mnt03"><img src="images/tp03.jpg" width="156" height="130" /></div><div class="mnt04"><div class="bt04"><a href="#">萍乡九中召开"四风"查摆问题专题会</a></div><div class="bt05">6月4日上午，萍乡九中召开党的群众路线教育实践活动查摆问题专题会议，市教育局第七督导组出席指导，学校领导班子成员和部分教师代表参加会议。会上，周新萍校长通报了学校在遵守党的政治纪律，贯彻执行中央八项规定、加强作风建设，"四风"方面存在突出问题，学校意见建议收集等方面的情况，分析了产生问题的原因，提出了今后的努力方向和改进措施。学校领导班子成员和部分教师代表参加会议。会上，周新萍校长通报了学校在遵守党的政治纪律，贯政治纪律，贯彻执行中央八</div></div></div><div class="content1"><ul class="ne2" style="margin-right:40px;"><li><a href="#">"青少年法治课堂暨模拟法庭进校园"</a></li><li><a href="#">"热烈庆祝萍乡市2015年中小学生足"</a></li><li><a href="#">"关于进一步加强工作纪律要求的通知"</a></li></ul><ul class="ne2"><li><a href="#">"青少年法治课堂暨模拟法庭进校园"</a></li><li><a href="#">"热烈庆祝萍乡市2015年中小学生足"</a></li><li><a href="#">"关于进一步加强工作纪律要求的通知"</a></li></ul></div></div></div><div class="right">
<div class="b01"><div class="info"><div class="title">学校视频</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"> <a href="#"><img src="images/ba01.jpg" width="304" height="196" /></a><ul class="futie1"><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li></ul></div></div><div class="news3"><div class="info"><div class="title">党建工作</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><p class="b02"><img src="images/tp05.png" width="310" height="110" /></p><ul class="ne7"><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li></ul></div></div><div class="news3"><div class="info"><div class="title">活动专栏</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><ul class="ne7"><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li></ul></div></div><div class="news3"><div class="info"><div class="title">德育天地</div><div class="more"><a href="#">MORE+</a></div></div><div class="content"><ul class="ne7"><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="#"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li><li><a href="new_detail.html"><span>2013-4-13</span>萍乡九中举行"学习龚全珍，我该怎么...</a></li></ul></div></div></div></div><div class="main2"><div class="info"><div class="title">名师风采</div><div class="more"><a href="#">more+</a></div></div><div class="content"><ul><li><img src="images/01.jpg" width="193" height="150" /></li><li><img src="images/02.jpg" width="193" height="150" /></li><li><img src="images/03.jpg" width="193" height="150" /></li><li><img src="images/04.jpg" width="193" height="150" /></li><li><img src="images/02.jpg" width="193" height="150" /></li></ul></div></div>
</div>
<div class="bottom">地址：江西省萍乡市建设西路 电话：7086099<br /> 
版权所有 © 2009 田家炳中学 All Rights Reserved 后台管理 推荐分辨率1024*768
</div>
</body>
</html>

四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)

web前端零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
在这里插入图片描述

五、源码获取

❉ ~ 关注我，点赞博文~ 每天带你涨知识!

❉1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。

❉ 2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板、大学生毕业HTML模板、期末大作业模板、等! 「在这里有好多前端开发者，一起探讨前端 Node 知识，互相学习」！

❉3.以上内容技术相关问题可以相互学习，可wx公Z号 ---> web前端小日记 获取更多源码 !

在这里插入图片描述

六、更多HTML期末大作业(成品下载)

>>>戳我>>>点击进入主页查看更多源码

200多例 HTML5期末考核大作业源码 包含 个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!