第一句子网 > web前端期末大作业 html+css+javascript 校园主题(东北大学8页)网页设计实例代码质量高...

web前端期末大作业 html+css+javascript 校园主题(东北大学8页)网页设计实例代码质量高...

时间：2024-04-27 14:17:14

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

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

作品介绍

1.网页作品简介方面 ：HTML期末大学生网页设计作业 ,喜欢的可以下载，文章页支持手机PC响应式布局。主要有：登录、注册、主页、列表页、详情页 等总共 5 个页面html下载。

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

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

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

文章目录

web前端期末大作业 html+css+javascript (东北大学8页)网页设计实例代码质量高[进入300例期末大作业作品]( https://ruanjiafeng.gitee.io/html-page )作品介绍一、作品演示二、代码实现

二、代码实现

<!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="/1999/xhtml">

<head>

<meta http-equiv="X-UA-Compatible" content="IE=7" />

<title>东华大学</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<meta name="keywords" content="" />

<meta name="description" content="" />

<link href="css/common.css" rel="stylesheet" type="text/css" />

<link href="css/lianghui.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="css/jquery.js"></script>

<script type="text/javascript" src="css/search_common.js"></script>

<SCRIPT type=text/javascript>

$(document).ready(function(){

$("#fancymenu >li").bind('mouseover',function(){

var index=$(this).index();

if (index!=0 && index!=6)

{

$(this).find(".erji").show();

$(this).siblings().find(".erji").hide();

}

})

$("#fancymenu >li").bind('mouseout',function(){

$(this).find(".erji").hide();

})

</SCRIPT>

</head>

<body>

<div style="WIDTH: 100%" id=dBody1>

<div style="MARGIN: auto; WIDTH: 1002px;" class="top center 1002">

<div>

<div style="WIDTH: auto" >

<div style="WIDTH:300px; FLOAT: left" >

<table border=0 cellSpacing=0 cellPadding=0 width="100%">

<tbody>

<tr>

<td

style="liNE-HEIGHT: 31px; HEIGHT: 31px; COLOR: #fff">欢迎进入东华大学！

</td>

</tr>

</tbody>

</table>

</div>

<div class="topright">

<div class="login"><a href="#" target="_blank">登录</a> | <a href="#" target="_blank">注册</a></div>

<div class=yuyrr><font id=jfimg ><a style="CURSOR: pointer" target=_self>设为首页</a> | </font> <a

href="#" target=_self>加入收藏</a> | <a class=yinc

href="#" target=_self>联系我们</a>

</div>

<div style="CLEAR: both"></div></div>

<div id=fancymenu class=headerMenulist>

<li class="index"><a href="index.aspx"><span><img class="indexImg" src="/ifile/109/-1/index.gif" /></span></a></li>

<li class='checkshouye' ><a title="东华首页" href="index.html"><span><div>东华首页</div></span></a> </li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="东华政策" href="#"><span><div>东华政策</div></span></a>

<ul class=erji>

<li><a href="/plus/list.php?tid=2">幸福动态</a> </li>

<li><a href="/plus/list.php?tid=4">行业新闻</a> </li>

</ul></li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="东华资讯" href="#"><span><div>东华资讯</div></span></a>

<ul class=erji>

<li><a href="/plus/list.php?tid=2">幸福数字</a> </li>

<li><a href="/plus/list.php?tid=2">幸福视频</a> </li>

</ul></li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="院校信息" href="#"><span><div>院校信息</div></span></a>

<ul class=erji>

<li><a href="/plus/list.php?tid=2">幸福政策</a> </li>

</ul></li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="硕士目录" href="#"><span><div>硕士目录</div></span></a>

<ul class=erji>

<li><a href="/plus/list.php?tid=2">幸福专家</a> </li>

<li><a href="/plus/list.php?tid=2">幸福人物</a> </li>

</ul></li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="历年分数线" href="#"><span><div>历年分数线</div></span></a></li>

<li class="menudiv"></li>

<li class='headerMenuli' ><a title="历年真题" href="#"><span><div>历年真题</div></span></a></li>

<li class="menudiv"></li>

<li class="serch"><div class="iupdiv">

<input type="text" name="sear_key" id="txtkey_heard" class="iuputcss" value="全站搜索" onclick="if (this.value!=''&& this.value!=undefined)this.value='';" />

</div><div name="sear_key" class="inputimg" onclick="heardJudge();"></div></li>

</div>

<div class=clr></div>

<div class=headerMenuBottom></div>

<div id=_ctl0__ctl3_div_effect></div>

</div>

<div style="margin: auto; WIDTH: 1002px;">

<div id=body>

<div class="w1002 center center_top">

<div class="center_top_left">

<h2><img src="img/center_top_left.jpg" /></h2>

<div id="news" style="width:">

<ul id="title">

<li class="link">东华政策</li>

<li class="link">最新资讯</li>

</ul>

<div style="clear:both"></div>

<div id="concent">

<div id="con">

<img src="img/tu1.jpg" />

<ul>

<li><span class="new_title"><a href="#">学校组织党委中心组(扩大)学习辅导报告集体学习党的...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校学子在上海高校学生创造发明“科创杯”奖评选中获...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校第64期入党积极分子培训班结业典礼日前举行 429名学...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校侨联主席朱利民教授当选中国侨联第九届委员会委员并荣获...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">全国纺织类三大赛事在我校举行，448件学生作品角逐各类奖项..</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校召开民用航空复合材料协同创新中心工作推进会 ...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校与新南威尔士大学联合主办国际素描研讨会及作品展 ... </a></span><span class="new_dates">[-12-30]</span></li>

</ul>

</div>

<div id="con">

<img src="img/tu1.jpg" />

<ul>

<li><span class="new_title"><a href="#">学校组织党委中心组(扩大)学习辅导报告集体学习党的...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校学子在上海高校学生创造发明“科创杯”奖评选中获...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校第64期入党积极分子培训班结业典礼日前举行 429名学...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校侨联主席朱利民教授当选中国侨联第九届委员会委员并荣获...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">全国纺织类三大赛事在我校举行，448件学生作品角逐各类奖项..</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校召开民用航空复合材料协同创新中心工作推进会 ...</a></span><span class="new_dates">[-12-30]</span></li>

<li><span class="new_title"><a href="#">我校与新南威尔士大学联合主办国际素描研讨会及作品展 ... </a></span><span class="new_dates">[-12-30]</span></li>

</ul>

</div>

<script language="javascript" type="text/javascript" src="css/news_js.js"></script>

</div>

<div class="center_top_right" style="position:relative">

<h2><img src="img/center_top_right.jpg" /></h2>

<div class="center_top_right_con" ><img src="img/center_top_right_img.jpg" />

<div class="catct"><h3>联系方式 <font style="color:#989898; font-size:10px; font-family:Arial, Helvetica, sans-serif">contacts</font></h3>

<p>021-54253789<br /><br />1424195041<br /><br />1424195041@<br /><br /><br /><font style="font-size:18px; color:#d50e0e; font-weight:bold; margin-left:-13px; font-family:'微软雅黑','黑体';">13541207463</font></p>

</div>

<div class="w1002 center center_middle">

<div class="center_middle_left">

<div class="fenlei">

<h3><span class="fenlei_names">考研入门 <font style="color:#989898; font-size:10px; font-family:Arial, Helvetica, sans-serif">kaoyan</font></span><span class="fenlei_more"><a href="#" target="_blank">MORE</a></span></h3>

<ul>

<li><span class="fenlei_title"><a href="#" target="_blank">我校荣获上海高校心理健康教育工作先进集体</a></span><span class="fenlei_date">-01-05</span></li>

</ul>

</div>

<div class="fenlei">

<ul>

<li><span class="fenlei_title"><a href="#" target="_blank">我校荣获上海高校心理健康教育工作先进集体</a></span><span class="fenlei_date">-01-05</span></li>

</ul>

</div>

<div class="fenlei">

<ul>

<li><span class="fenlei_title"><a href="#" target="_blank">我校荣获上海高校心理健康教育工作先进集体</a></span><span class="fenlei_date">-01-05</span></li>

</ul>

</div>

<div class="fenlei">

<ul>

<li><span class="fenlei_title"><a href="#" target="_blank">我校荣获上海高校心理健康教育工作先进集体</a></span><span class="fenlei_date">-01-05</span></li>

</ul>

</div>

<div class="clear"></div>

<div class="center_middle_cen">

<div class="edu_info"><a href="#" target="_blank"><img src="img/mem.jpg" /></a><a href="#" target="_blank"><img src="img/gct.jpg" /></a><a href="#" target="_blank"><img src="img/mba.jpg" /></a><a href="#" target="_blank"><img src="img/emba.jpg" /></a></div>

<div class="edu_other"><a href="#" target="_blank"><img src="img/pic1.jpg" /></a><a href="#" target="_blank"><img src="img/pic2.jpg" /></a><a href="#" target="_blank"><img src="img/pic3.jpg" /></a><a href="#" target="_blank"><img src="img/pic4.jpg" /></a><a href="#" target="_blank"><img src="img/pic5.jpg" /></a><a href="#" target="_blank"><img src="img/pic6.jpg" /></a><a href="#" target="_blank"><img src="img/pic7.jpg" /></a></div>

</div>

<div class="center_middle_right">

<div class="news_list" style=" height:280px">

<h3>最新新闻 <font style="color:#989898; font-size:10px; font-family:Arial, Helvetica, sans-serif">news</font></h3>

<ul>

<li><a href="#" target="_blank">学校召开总支书记工作会议沟通交流学校近期工作 </a></li>

</ul>

</div>

<div class="news_list" style=" height:305px">

<h3>最新动态 <font style="color:#989898; font-size:10px; font-family:Arial, Helvetica, sans-serif">news</font></h3>

<ul>

<li><a href="#" target="_blank">学校召开总支书记工作会议沟通交流学校近期工作 </a></li>

</ul>

</div>

<div class="blank10"></div>

<div class="center_bottom w1002 center">

<DL class=image_list>

<DT><H4 class=vertical_title><P>东</P><P>华</P><P>风</P><P>采</P></H4></DT>

<DD><A href="#" target=_blank><IMG src="img/img1.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img2.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img3.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img4.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img5.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

</DL>

<DL style="MARGIN-TOP: 20px" class=image_list>

<DT><H4 class=vertical_title><P>东</P><P>华</P><P>风</P><P>采</P></H4></DT>

<DD><A href="#" target=_blank><IMG src="img/img6.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img7.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img8.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img9.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

<DD><A href="#" target=_blank><IMG src="img/img10.jpg"> <div class=trans-bg></div><P>致青春——纪念援疆五十周年暨‘艺术与我·’”主题晚会举行</P></A></DD>

</DL></div></div></div>

<div style="WIDTH: 100%" id=dBody2>

<div id=_ctl10__ctl0_box class="footer" style=" height:110px">

<p>Copyright? 沪ICP备05003365 沪举报中心 <br />

松江校区：上海市松江区人民北路2999号 20，延安路校区：上海市延安西路1882号 200051</p>

</div>

</body></html>

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。

web前端期末大作业 html+css+javascript 校园主题(东北大学8页)网页设计实例 代码质量高...

文章目录

web前端期末大作业 html+css+javascript 校园主题(东北大学8页)网页设计实例代码质量高...