时间：2023-09-30 00:06:02 | 来源：网站运营
时间：2023-09-30 00:06:02 来源：网站运营
HTML5期末大作业：游戏网站设计——腾讯游戏(页)学生HTML个人网页作业作品下载 个人网页设计制作 大学生个人网站作业模板 简单个人网页制作：常见网页设计作业题材有个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
在线咨询
PC电脑端关注我们1.网页作品简介 ：HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载，文章页支持手机PC响应式布局。2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页）。3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title> 仿腾讯游戏官网</title> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"> <link rel="icon" type="image/x-icon" href="./img/未标题-1.png" /> <link rel="stylesheet" href="./Swiper/swiper.min.css"> <link rel="stylesheet" href="./font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="./css/index.css"> <script src="./js/jquery-2.1.0.js"></script> <script src="./Swiper/swiper.min.js"></script> <style> html, body { position: relative; height: 100%; } .dis_bottom{ display: none; } body { background: #eee; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; color:#000; margin: 0; padding: 0; } .swiper-container { width: 100%; height: 100%; } .swiper-slide { /* text-align: center; */ font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-pagination-bullet{ border-radius: 100%; height: 30px; border: 4px solid white; background: none; box-shadow: 0px 2px 5px aliceblue ; } .swiper-pagination{ margin-right: 3%; } </style></head><body> <!-- Swiper --> <div class="container1" style="z-index: 999999999; position: fixed; display: flex; justify-content: space-between;"> <a href="./index.html" style="z-index: 99;"> <img src="./img/logo.png" alt=""> </a><div class="f1_1" style="z-index: 99; display: flex; justify-content: space-around; width: 25%; position: absolute; right: 0;"> <div style="color: whitesmoke; line-height: 80px;"> <a href="./about.html">关于腾讯游戏</a> </div> <div style="color: whitesmoke; line-height: 80px;"> <a href="./Introduction.html">游戏介绍</a> </div> <div style="color: whitesmoke; line-height: 80px;"> <a href="./Brands.html">品牌活动</a> </div></div><div class="fa fa-bars fa-3x dis_bottom" style="line-height: 80px; color: white; z-index: 99999999;"> </div><div class="fa fa-bars fa-3x dis_phone" style="line-height: 80px; color: white; display: none;"> </div><div class="fa fa-window-close fa-3x dis_phone_1" style="line-height: 80px; color: white; display: none;"> </div></div><div class="fix_phone" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: black; z-index: 9999999; padding: 100px 40px ;"> <a href="./index.html"> <div style="color: white; font-size: 25px; margin-top: 20px;"> 首页</div> </a> <a href="./about.html"> <div style="color: white; opacity: 0.5; margin-top: 20px;font-size: 25px;"> 关于腾讯游戏</div> </a> <a href="./Introduction.html"> <div style="color: white; opacity: 0.5; margin-top: 20px; font-size: 25px;"> 游戏介绍</div> </a> <a href="./Brands.html"> <div style="color: white; opacity: 0.5; margin-top: 20px; font-size: 25px;"> 品牌活动</div> </a></div> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="f1"> <video width="100%" height="100%" src="./img/1022_18cd57db826a4884a650045a2786ed7e.f0.mp4" muted="true" loop="true" autoplay="true" class="video"> </video> <img class="tit_1" src="./img/title_1.png" style="z-index: 99; position: absolute; top: 30%; width:40% ; left: 50%; transform: translateX(-50%); margin: 0 auto;" alt=""> <i class="fa fa-play-circle-o fa-5x" style="color: white; cursor: pointer; position: absolute; z-index: 99; top: 60%; cursor: pointer; left: 50%; transform: translateX(-50%);"> </i> <div class="geng_x" style="display: none; color: white; width: 100%; background: #0f0f1e; text-align: right; height: 60px; position: absolute; left: 0; top: 80px;"> <i class="fa fa-window-close fa-2x" style="cursor: pointer; margin-right: 4%;"></i> </div> <iframe style="display: none; z-index: 999; position: relative; margin-top: 115px; width: 100%; height: 100%;" src="" frameborder="0"> </iframe> </div> </div> <div class="swiper-slide"> <div class="f2" > <img src="./img/transition_2.png" alt="" style="width: 100%; height: 100%;" > <img src="./img/picture_2.png" style="position: absolute; top: 0; right: 0; height: 100%; opacity: 0.4;" alt=""> <img src="./img/figure_2.png" alt="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"> <img class="f2_1" src="./img/title_2.png" style="width: 30%; margin-top: 8%; margin-left: 8%; position: absolute; top: 0; left: 0;" alt=""> <div class="f2_2" style="z-index: 99; position: absolute; top: 0; left: 0; font-size: 20px; opacity: 0.7; margin-left: 8%; color: white;"> 腾讯游戏致力于为玩家提供丰富优质的游戏体验，让玩家不只在游戏里收获快乐<br> 也能体验多重身份、广交好友、感受多元文化腾讯游戏不断提升游戏品质、拓宽品类<br> 打造极致的游戏体验，陪伴玩家一起发现游戏乐趣的无限可能 </div> <div class="f2_3" style="color: white; font-weight: bold; font-size: 30px; z-index: 99; position: absolute; margin-left: 8%;"> <a href="">游戏介绍 <i class="fa fa-chevron-right"></i></a> </div> </div> </div> <div class="swiper-slide"> <div class="f2" > <img src="./img/transition_3.png" alt="" style="width: 100%; height: 100%;" > <img src="./img/picture_3.png" style="position: absolute; top: 0; right: 0; height: 100%; opacity: 0.4;" alt=""> <img src="./img/figure_3.png" alt="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"> <img class="f2_1" src="./img/title_3.png" style="width: 30%; margin-top: 8%; margin-left: 8%; position: absolute; top: 0; left: 0;" alt=""> <div class="f2_2" style="z-index: 99; position: absolute; top: 0; left: 0; font-size: 20px; opacity: 0.7; margin-left: 8%; color: white;"> 腾讯游戏将不断探索创新，拓宽游戏的边界，发现更多创新玩法，通过游戏<br> 与前沿科技的融合，为玩家提供更新奇的游戏体验和乐趣，同时推动游戏<br> 行业的发展，发现游戏的更多可能 </div> <div class="f2_3" style=" color: white; width: 100%; font-weight: bold; font-size: 30px; z-index: 99; position: absolute; padding-left: 8%;"> <a href="" style="margin-right: 4%; ">NExT Studios <i class="fa fa-chevron-right"></i></a> <br> <a href=""> 腾讯极光计划 <i class="fa fa-chevron-right"></i> </a> </div> </div> </div> <div class="swiper-slide"> <div class="f2" > <img src="./img/transition_4.png" alt="" style="width: 100%; height: 100%;" > <img src="./img/picture_4.png" style="position: absolute; top: 0; right: 0; height: 100%; opacity: 0.4;" alt=""> <img src="./img/figure_4.png" alt="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"> <img class="f2_1" src="./img/title_4.png" style="width: 30%; margin-top: 8%; margin-left: 8%; position: absolute; top: 0; left: 0;" alt=""> <div class="f2_2" style="z-index: 99; position: absolute; top: 0; left: 0; font-size: 20px; opacity: 0.7; margin-left: 8%; color: white;"> 从游戏出发，腾讯游戏用数字的方式架起了文化与生活之间的桥梁<br> 助力各类传统文化发出现代的表达，走进玩家以及更多年轻人的生活里<br> 打造中国文化符号 </div> <div class="f2_3" style="color: white; font-weight: bold; font-size: 30px; z-index: 99; position: absolute; margin-left: 8%;"> <a href="" class="f2_3_1">TGC腾讯数字文创节 <i class="fa fa-chevron-right"></i></a> </div> </div> </div> <div class="swiper-slide"> <div class="f2" > <img src="./img/transition_5.png" alt="" style="width: 100%; height: 100%;" > <img src="./img/picture_5.png" style="position: absolute; top: 0; right: 0; height: 100%; opacity: 0.4;" alt=""> <img src="./img/figure_5.png" alt="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"> <img class="f2_1" src="./img/title_5.png" style="width: 30%; margin-top: 8%; margin-left: 8%; position: absolute; top: 0; left: 0;" alt=""> <div class="f2_2" style="z-index: 99; position: absolute; top: 0; left: 0; font-size: 20px; opacity: 0.7; margin-left: 8%; color: white;"> 腾讯游戏不仅致力于为玩家提供更多元的游戏体验，更希望通 过游戏作为载体和平台<br> 守护正向价值，传播人文关怀，激发更多社会正向能量。腾讯游戏不断探索游戏在社会中<br> 扮演的角色积极主动承担社会责任，践行社会使命 </div> <div class="f2_3" style=" color: white; width: 100%; font-weight: bold; font-size: 30px; z-index: 99; position: absolute; padding-left: 8%;"> <a href="" style="margin-right: 4%; font-size: 17px; ">腾讯游戏成长守护平台 <i class="fa fa-chevron-right"></i></a> <br> <a href="" style="font-size: 17px;"> 腾讯游戏追梦计划 <i class="fa fa-chevron-right"></i> </a> <br> <a href="" style="font-size: 17px;"> 腾讯游戏学院 <i class="fa fa-chevron-right"></i> </a> </div> </div> </div> <div class="swiper-slide last"> <div class="f2 last_f2" style="padding-top: 10%; box-sizing: border-box;" > <img src="./img/transition_5.jpg" alt="" style="position: absolute; top: 0; left: 0; z-index: 9; width: 100%; height: 100%;" > <img src="./img/figure_6.png" alt="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"> <div class="container2"> <div> <img src="./img/news1.jpg" alt=""> <div > <p> 今天腾讯游戏品牌全新升级 </p> <p> 2019.11.21 </p> </div> </div> <div class="new_more" style="text-align: center; color: white; margin-top: 132px; display: none;"> <a href="" style="text-decoration: white;"><u>查看更多，就用腾讯新闻</u></a> </div> <div class="new_2"> <img src="./img/news2.png" alt=""> <div> <p> 腾讯马晓花:推动数字文化高质量发展，共同… </p> <p> 2019.8.1 </p> </div> </div> <div class="new_3"> <img src="./img/news3.jpg" alt=""> <div> <p> 腾讯程武：新文创是一场面向未来的文化生… </p> <p> 2019.3.24 </p> </div> </div> </div> <div class="geng_last" style="padding-top: 2%; position: absolute; bottom: 0px; left: 0px; height: 30%; background: #28234c; width: 100%; z-index: 99;"> <div class="container3"> <div style="width: 40%; display: flex; justify-content: space-between;"> <div class="geng_love" style="color: white; font-size: 17px; font-weight: bold;">关注我们<i class="fa fa-sort-desc" style="display: none;"></i> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">微信</div> </a> <a href=""> <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">新浪微博</div> </a> </div> <div class="geng_love" style="color: white; font-size: 17px; font-weight: bold;">加入我们<i class="fa fa-sort-desc" style="display: none;"></i> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">社会招聘</div> </a> <a href=""> <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">校园招聘</div> </a> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">国际招聘</div> </a> </div> <div class="geng_love" style="color: white; font-size: 17px; font-weight: bold;">联系我们<i class="fa fa-sort-desc" style="display: none;"></i> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">客户服务</div> </a> <a href=""> <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">合作洽谈</div> </a> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">服务采购</div> </a> </div> <div class="geng_love" style="color: white; font-size: 17px; font-weight: bold;">法律信息<i class="fa fa-sort-desc" style="display: none;"></i> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">服务协议</div> </a> <a href=""> <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">隐私政策</div> </a> <a href="" > <div class="last_item" style="margin-top: 10px; color: white; opacity: 0.5; font-size: 14px;">知识产权</div> </a> </div> </div> <div><img style="width: 197px; height: 27px;" src="./img/logo_tencent.png" alt=""></div> </div> </div> </div> </div> </div> <!-- Add Pagination --> <div class="swiper-pagination"></div> </div> <!-- Swiper JS --> <script> var swiper = new Swiper('.swiper-container', { mousewheel: true, direction: 'vertical', pagination: { el: '.swiper-pagination', clickable: true, }, }); </script><script src="./js/index.js"></script> <!-- Initialize Swiper --></body></html>~ 关注我，点赞博文~ 每天带你涨知识!相关问题可以相互学习，可关注↓公Z号 获取更多源码 !web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程) 适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站 HTML5期末考核大作业源码 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他* 可满足大学生网页大作业网页设计需求, 喜欢的可以下载! 关键词：作业,游戏,学生,作品,设计
