-
html静态网站简单的学生网页作业源码 基于游戏网站设计与实现共计10个页面 (仿地下城与勇士游戏网页)
👨🎓网页题目
🎮游戏官网、⛹️游戏网站、🕹️电竞游戏、🎴游戏介绍、等网站的设计与制作。
✍️网页描述
⭐ 网页中包含：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频音频元素，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。
🌐网站效果
🔧 代码实现
🧱HTML结构代码
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>地下城与勇士-DNF-官方网站-腾讯游戏-格斗网游王者之作,500万同时在线title> <link rel="stylesheet" href="css/reset.css"> <link rel="stylesheet" href="css/common.css"> <link rel="stylesheet" href="css/index.css">- head> <body> <div class="topnav clearfix"> <div class="banxin"> <div class="topnav-left"> <a href="#">a> <a href="safety.html">a> div> <div class="topnav-right"> <a href="download.html">游戏下载a> <a href="#">点卷充值 a> <a href="#">开通黑钻a> <a href="nav.html">返回官网首页a> div> div> div> <div class="center clearfix"> <div class="daohang clearfix"> <div class="banxin"> <a href="" class="dnflogo">a> <ul> <a href=""> <li>官网首页li> <span>HOMEspan> a> <a href="#"> <li>游戏资料li> <span>GAME INFOspan> a> <a href="activity.html"> <li>活动li> <span>ACTIVITVspan> a> <a href="scattered.html"> <li>赛事li> <span>EVENTspan> a> <a href="#"> <li>用户服务li> <span>SYSTEMspan> a> <a href="safety.html"> <li>游戏安全li> <span>SECURTYspan> a> <a href="convinced.html"> <li>玩家社区li> <span>COMMONITYspan> a> ul> <div class="daohangup"> <div class="banxin"> <ol> <li><a href="#"> 世界观a>li> <li><a href="javascript:;">周边商城a> li> <li><a href="#">道聚城a> li> ol> <ol> <a href="">a> <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> ol> <ol class="huodong"> <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> ol> <ol class="huodong"> <li><a href="#"> F1天王赛a>li> <li><a href="#"> 职业联赛a>li> <li><a href="#"> 职业第一人a>li> <li><a href="#"> DPL赛事a>li> ol> <ol> <li><a href="#"> 充值a>li> <li><a href="#"> 兑换CDKEYa>li> <li><a href="#"> 角色恢复a>li> <li><a href="#"> 圣耀服务a>li> ol> <ol> <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> ol> <ol> <li><a href="#">讨论a> li> <li><a href="#">微博a> li> <li><a href="#">问答a> li> <li class="app"><a href="#">DNF助手a> <img src="picture/app.png" alt=""> <li class="wx"><a href="#">微信a> <img src="picture/wx.png" alt=""> li> ol> div> div> div> div> <div class="kuanghuan"> <a href="#">a> div> <div class="content-top clearfix"> <div class="banxin clearfix"> <a href="greenhand.html"> <div class="content-top-left">div> a> <div class="content-top-zhanshi "> <div> <h3>星罗万象h3> <span>展示国宝乐领纯净增幅书span> <a href="scattered.html"> <s> 查看s> <i>i>a> div> <div class="yinying"><img src="picture/yinying.jpg" alt="">div> div> <div class="content-top-lunbotu"> <a href="sign.html"><img src="picture/content_top_lunbotu.jpeg" alt="">a> <ul> <a href="#"> <li>li> a> <a href="#"> <li>li> a> <a href="#"> <li>li> a> <a href="#"> <li>li> a> <a href="#"> <li>li> a> <a href="#"> <li>li> a> ul> div> <div class="content-top-right clearfix"> <div class="content-top-right-top"> <ul> <a href=""> <li class="four">综合li> a> <a href=""> <li class="two">公告li> a> <a href=""> <li>赛事li> a> <a href=""> <li class="six">社区li> a> <a href=""> <li>媒体li> a> ul> div> <div class="content-top-right-center clearfix"> <a href="#">DNF官网测试团11月招募a> div> <div class="content-top-right-content"> <ul> <li><i>社区i><a href="">阳光少女翻翻乐活动攻略a>li> <li><i>社区i> <a href="">新·周常乐副本初体验a>li> <li><i>社区i><a href="">阳光少女成长记中的小活动攻略a> li> <li><i>社区i><a href=""> 没有刷过强者之路的勇士不算真正的强者a>li> <li><i>社区i><a href="">3W魔攻平民11分钟召唤轻松担任普雷a>li> <li><i>社区i><a href="">[壁纸铃声]第二期:魔界人的那些事a>li> ul> div> <div class="content-top-right-bottom"> <a href="#">查看更多资讯a> <i>i> div> div> div> div> div> <div class="bg clearfix">div> <div class="zhongxin clearfix"> <div class="banxin"> <div class="rukou clearfix"> <div class="rukou-top"> <h4>快速入口h4> <a href="#"> <div class="rukoulogo"> <i class="rukoulogo1">i>div> <p>CDK兑换p> a> <a href="#"> <div class="heizuan"><i class="heizuan1">i>div> <p>黑钻专区p> a> <a href="#"> <div class="kefulogo"><i class="kefulogo1">i>div> <p>客服留言p> a> <a href="#"> <div class="anquanlogo"> <i class="anquanlogo1">i> div> <p>安全中心p> a> <a href="#"> <div class="zhoubianlogo"> <i class="zhoubianlogo1">i> div> <p>周边商城p> a> <a href="#"> <div class="kefulogo_1"> <i class="kefulogo1">i> div> <p>xx客服p> a> div> <div class="rukou-bottom clearfix"> <h4>玩家社区h4> <a href="#"> <div class="luntanlogo"> <i class="luntanlogo1">i> div> <p>CDK兑换p> a> <a href="#"> <div class="weixinlogo"> <i class="weixinlogo1">i> div> <p>黑钻专区p> a> <a href="#"> <div class="tubialogo"> <i class="tubialogo">i> div> <p>客服留言p> a> <a href="#"> <div class="diantailogo"> <i class="diantailogo1">i> div> <p>安全中心p> a> <a href="#"> <div class="yuanhualogo"> <i class="yuanhualogo1">i> div> <p>原画馆p> a> <a href="#"> <div class="xinyuelogo"> <i class="xinyuelogo1">i> div> <p>心悦专区p> a> div> div> <div class="zhongxin-center clearfix"> <div class="zhongxin-center-topnav"> <h3>活动中心h3> <a href="convinced.html" class="zhongxin-xinyuelogo">a> <a href="activity.html" class="zhongxin-huodong-logo">活动中心a> div> <div class="zhongxin-center-top"> <a href="#">热门推荐<i>i> a> <a href="#">新手升级<i>i> a> <a href="#">商城特惠<i>i> a> <a href="#">合作活动<i>i> a> div>