Web前端开发技术课程⼤作业，期末考试Web前端开发技术课程⼤作业，期末考试
作业要求
⽹站前端程序不仅要能够把⽤户要求的内容呈现出来，还要满⾜布局良好、界⾯美观、配⾊优雅、表现形式多样等要求。为此，本次作业的要求主要有：
（1）登录功能。登陆是对⽤户的验证，防⽌⾮法⽤户登陆和使⽤。
（2）注册功能。注册是对新⽤户的加⼊设定的，可以增加游戏⽤户。
（3）导航功能。提供完整的系统导航功能，帮助⽤户快速定位到需要浏览的区域。
（3）⼴告轮播。⼴告轮播实现了重要客户的主要产品核⼼位置展⽰功能。
（4）搜索⼊⼝。搜索功能提供客户搜索定位功能，可以帮助客户快速到需要的产品。
最终界⾯
部分代码呈现
index.html
<!doctype html >
<html lang ="en ">
<head >
<title >英雄联盟</title >
<meta charset ="UTF-8">
<meta name ="keywords " content ="LOL，腾讯游戏，英雄联盟" />
<meta name ="description " content ="LOL，腾讯游戏，英雄联盟" />
<link href ="css/index.css " rel ="stylesheet " type ="text/css " />
<script type ="text/javascript " src ="js/qiehuan.js "></script >
<script type ="text/javascript " src ="js/switchpic.js "></script >
</head >
<body onload ="init();">
<div id ="topNavBar ">
<input type ="text " value ="">
<input type ="button " value ="搜索" id ="where ">
<a href ="logon.html " class ="nav_on ">注册</a >  
<a href ="login.html " class ="nav_on ">登录</a >
</div >
<div id ="container " class ="">
<div id="header"class="">
<img src="img/lol_logo.jpg"alt="">
</div>
<div id="menu_out">
<div id="menu_in">
<div id="menu">
<ul id="nav">
<li><a class="nav_on"id="mynav0"onmouseover="javascript:qiehuan(0)"href="#"target="framebody"><span>游戏资料</span></a></li> <li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(1)"id="mynav1"class="nav_off"><span>游戏商城</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(2)"id="mynav2"class="nav_off"><span>游戏合作</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(3)"id="mynav3"class="nav_off"><span>社区互动</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(4)"id="mynav4"class="nav_off"><span>赛事官⽹</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(5)"id="mynav5"class="nav_off"><span>⾃助系统</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(6)"id="mynav6"class="nav_off"><span>游戏视频</span></a></li>
<li class="menu_line"></li>
<li><a href="#"onmouseover="javascript:qiehuan(7)"id="mynav7"class="nav_off"><span>填写问卷</span></a></li>
<li class="menu_line"></li>
<li><a class="nav_off"id="mynav8"onmouseover="javascript:qiehuan(8)"href="#"><span>关于⽹站</span></a></li>
</ul>
<div id="menu_con">
<div id="qh_con0">
<ul>
<li><a href="#"><span>游戏下载</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>游戏指引</span></a></li>
<li class="menu_line2"></li>
<li><a href="./web_first.html"target="block"><span>资料库</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>云顶之弈</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>攻略中⼼</span></a></li>
</ul>
</div>
<div id="qh_con1">
<ul>
<li><a href="#"><span>点卷充值</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>道具城</span></a></li>html网页设计期末大作业
<li class="menu_line2"></li>
<li><a href="#"><span>周边商城</span></a></li>
</ul>
</div>
<div id="qh_con2">
<ul>
<li><a href="#"><span>LOL桌游</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>LOL信⽤卡</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>⽹吧特权</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>电竞⼩说</span></a></li>
</ul>
</div>
<div id="qh_con3">
<ul>
<li><a href="#"><span>官⽅社区</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>视频中⼼</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>官⽅论坛</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>官⽅</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>官⽅微博</span></a></li>
</ul>
</div>
<div id="qh_con4">
<ul>
<li><a href="#"><span>LPL职业联赛</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>LDL发展联赛</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>全球总决赛</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>全明星赛</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>季中杯</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>德玛西亚杯</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>全国⾼校联赛</span></a></li>
</ul>
</div>
<div id="qh_con5">
<ul>
<li><a href="#"><span>转区系统</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>封号查询</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>账号注销</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>信誉分系统</span></a></li>
</ul>
</div>
<div id="qh_con6">
<ul>
<li><a href="#"><span>推荐视频</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>官⽅视频</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>娱乐视频</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>赛事视频</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>云顶之弈视频</span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>教学视频</span></a></li>
</ul>
</div>
<div id="qh_con7">
<ul>
<li><a href="web_question.html"target="block"><span>填写问卷</span></a></li>
</ul>
</div>
<div id="qh_con8">
<ul>
<li><a href="#"><span></span></a></li>
<li class="menu_line2"></li>
<li><a href="#"><span>⽹站作者</span></a></li>
</ul>
</div>
</div>
</div>
</div>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。