時間：2023-09-30 00:06:02 | 來源：網(wǎng)站運營
時間：2023-09-30 00:06:02 來源：網(wǎng)站運營
HTML5期末大作業(yè)：游戲網(wǎng)站設(shè)計——騰訊游戲(頁)學(xué)生HTML個人網(wǎng)頁作業(yè)作品下載 個人網(wǎng)頁設(shè)計制作 大學(xué)生個人網(wǎng)站作業(yè)模板 簡單個人網(wǎng)頁制作：常見網(wǎng)頁設(shè)計作業(yè)題材有個人、 美食、 公司、 學(xué)校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他等網(wǎng)頁設(shè)計題目,A+水平作業(yè), 可滿足大學(xué)生網(wǎng)頁大作業(yè)網(wǎng)頁設(shè)計需求, 喜歡的可以下載!
在線咨詢
PC電腦端關(guān)注我們1.網(wǎng)頁作品簡介 ：HTML期末大學(xué)生網(wǎng)頁設(shè)計作業(yè) A+水平 ,喜歡的可以下載，文章頁支持手機PC響應(yīng)式布局。2.網(wǎng)頁作品編輯：作品下載后可使用任意HTML編輯軟件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML軟件編輯修改網(wǎng)頁）。3.網(wǎng)頁作品技術(shù)：Div+CSS、鼠標滑過特效、Table、導(dǎo)航欄效果、banner、表單、二級三級頁面等，視頻、 音頻元素 、Flash，同時設(shè)計了logo（源文件），基本期末作業(yè)所需的知識點全覆蓋。<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title> 仿騰訊游戲官網(wǎng)</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">關(guān)于騰訊游戲</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;"> 關(guān)于騰訊游戲</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;"> 騰訊游戲致力于為玩家提供豐富優(yōu)質(zhì)的游戲體驗，讓玩家不只在游戲里收獲快樂<br> 也能體驗多重身份、廣交好友、感受多元文化騰訊游戲不斷提升游戲品質(zhì)、拓寬品類<br> 打造極致的游戲體驗，陪伴玩家一起發(fā)現(xiàn)游戲樂趣的無限可能 </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;"> 騰訊游戲?qū)⒉粩嗵剿鲃?chuàng)新，拓寬游戲的邊界，發(fā)現(xiàn)更多創(chuàng)新玩法，通過游戲<br> 與前沿科技的融合，為玩家提供更新奇的游戲體驗和樂趣，同時推動游戲<br> 行業(yè)的發(fā)展，發(fā)現(xiàn)游戲的更多可能 </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;"> 從游戲出發(fā)，騰訊游戲用數(shù)字的方式架起了文化與生活之間的橋梁<br> 助力各類傳統(tǒng)文化發(fā)出現(xiàn)代的表達，走進玩家以及更多年輕人的生活里<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騰訊數(shù)字文創(chuàng)節(jié) <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> 守護正向價值，傳播人文關(guān)懷，激發(fā)更多社會正向能量。騰訊游戲不斷探索游戲在社會中<br> 扮演的角色積極主動承擔(dān)社會責(zé)任，踐行社會使命 </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;"> 騰訊游戲?qū)W院 <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> 騰訊馬曉花:推動數(shù)字文化高質(zhì)量發(fā)展，共同… </p> <p> 2019.8.1 </p> </div> </div> <div class="new_3"> <img src="./img/news3.jpg" alt=""> <div> <p> 騰訊程武：新文創(chuàng)是一場面向未來的文化生… </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;">關(guān)注我們<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;">聯(lián)系我們<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;">客戶服務(wù)</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;">服務(wù)采購</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;">服務(wù)協(xié)議</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;">知識產(chǎn)權(quán)</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>~ 關(guān)注我，點贊博文~ 每天帶你漲知識!相關(guān)問題可以相互學(xué)習(xí)，可關(guān)注↓公Z號 獲取更多源碼 !web前端 零基礎(chǔ)-入門到高級 (視頻+源碼+開發(fā)軟件+學(xué)習(xí)資料+面試題) 一整套 (教程) 適合入門到高級的童鞋們?nèi)胧謣送1000套HTML+CSS+JavaScript模板網(wǎng)站 HTML5期末考核大作業(yè)源碼 包含 個人、 美食、 公司、 學(xué)校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他* 可滿足大學(xué)生網(wǎng)頁大作業(yè)網(wǎng)頁設(shè)計需求, 喜歡的可以下載! 關(guān)鍵詞：作業(yè),游戲,學(xué)生,作品,設(shè)計
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。
