當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

html简单个人网页制作网站设计——腾讯游戏官网(13页) HTML+CSS+JavaScript web网页设计与开发

發布時間：2023/12/10 javascript 29 豆豆

生活随笔收集整理的這篇文章主要介紹了 html简单个人网页制作网站设计——腾讯游戏官网(13页) HTML+CSS+JavaScript web网页设计与开发小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

HTML5期末大作業：騰訊游戲網站設計——騰訊游戲官網(13頁) HTML+CSS+JavaScript web網頁設計與開發

常見網頁設計作業題材有個人、美食、公司、學校、旅游、電商、寵物、電器、茶葉、家居、酒店、舞蹈、動漫、明星、服裝、體育、化妝品、物流、環保、書籍、婚紗、軍事、游戲、節日、戒煙、電影、攝影、文化、家鄉、鮮花、禮品、汽車、其他等網頁設計題目, A+水平作業, 可滿足大學生網頁大作業網頁設計需求, 喜歡的可以下載!

作品介紹

1.網頁作品簡介 ：HTML期末大學生網頁設計作業 A+水平 ,喜歡的可以下載，文章頁支持手機PC響應式布局。

2.網頁作品編輯：作品下載后可使用任意HTML編輯軟件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML軟件編輯修改網頁）。

3.網頁作品技術：Div+CSS、鼠標滑過特效、Table、導航欄效果、banner、表單、二級三級頁面等，視頻、音頻元素、Flash，同時設計了logo（源文件），基本期末作業所需的知識點全覆蓋。

文章目錄

HTML5期末大作業：騰訊游戲網站設計——騰訊游戲官網(13頁) HTML+CSS+JavaScript web網頁設計與開發
作品介紹
一、作品展示
二、文件目錄
三、代碼實現
四、獲取更多源碼
五、學習資料
六、更多源碼

一、作品展示

二、文件目錄

三、代碼實現

<!DOCTYPE html>     <html class="noIE" lang="zh"> <head><title>益行游戲 - 讓出行更有趣</title><link rel="icon" href="public/favicon.ico"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale=1.0, user-scalable=no" /><meta name="description" content="益行游戲致力于開發LBS精品游戲，希望您能在游戲中收獲知識，在學習中收獲快樂。我們是來自于武漢理工大學的創業團隊，同時還有理工印象、益行人支教團等創業及公益項目。"><meta name="keywords" content="益行,益行游戲,行界：零,行界,嗨球,益疊塔,理工印象,益行人,益行人支教團,LBS游戲,AR游戲,出行游戲,戶外游戲"><link rel="stylesheet" href="public/assets/css/bootstrap.min.css"><link rel="stylesheet" href="public/assets/css/font-awesome.min.css"><link rel="stylesheet" href="public/assets/css/style.css" media="screen" /><script src="public/assets/js/respond.js"></script> </head><body id="home"><div id="drawer-right"><div class="cross text-right"><a class="toggleDrawer" href="#"><i class="fa fa-times-circle fa-2x"></i></a></div><nav style="text-align:center"><h2>導航</h2><ul class="nav nav-pills nav-stacked"><li><a href="#wrapper"><i class="fa fa-home"></i> 首頁</a></li><li><a href="#portfolio"><i class="fa fa-bookmark"></i> 產品</a></li><li><a href="#services"><i class="fa fa-tasks"></i> 業務</a></li><li><a href="#testimonials"><i class="fa fa-thumbs-up"></i> 同伴</a></li></ul></nav><div class="social"><h2 style="text-align:center">聯系我們</h2><ul class="nav nav-pills nav-stacked"><li><a href="https://github.com/1-xing" target="_blank"><i class="fa fa-github"></i></a></li><li><a href="http://jq.qq.com/?_wv=1027&k=2A3mMAb" target="_blank"><i class="fa fa-qq"></i></a></li><li><a href="http://weibo.com/u/5208965212" target="_blank"><i class="fa fa-weibo"></i></a></li><li><a href="http://mp.weixin.qq.com/s?__biz=MzA5OTA0MzgwNg==&mid=215581320&idx=1&sn=471cbd57b34683fc18213e9829648663#rd" target="_blank"><i class="fa fa-wechat"></i></a></li></ul><div class="wechat"><img src="public/assets/images/1-xing-wechat.jpg" alt="益行游戲公眾微信平臺"></img><br><br><h5><font color="#CCCCCC">微信公眾平臺</font></h5><br><h6>wo men ye ai ni yo</h6><i class="fa fa-heart-o"></i></div></div></div><div id="wrapper"><div id="header" class="content-block"><section class="top clearfix"><div class="pull-left topButton"><h2><a href="index.html"><i class="fa fa-home"></i></a></h2></div><div class="pull-right topButton"><h3><a class="toggleDrawer" href="#"><i class="fa fa-bars"></i></a></h3></div></section><section class="center"><div data-scroll-reveal="wait 0.3s, then enter bottom over 2s"><h1 id="biglogo" class="biglogo"><a class="biglogo">1</a></h1></div></section><section id="secondlgo"><img data-scroll-reveal="wait 0.8s, then enter bottom over 2.5s" src="public/assets/images/header-bg-logo2.png"></section><section class="bottom"><a id="scrollToContent" href="#"><img data-scroll-reveal="wait 1.2s, then enter bottom over 3.0s" src="public/assets/images/arrow_down.png"></a></section></div><div class="content-block" id="portfolio"><div class="container"><header class="block-heading clearfix"><h1 data-scroll-reveal="wait 0.2s, then enter top over 0.5s">最新產品</h1><p data-scroll-reveal="wait 0.2s, then enter top over 0.5s">讓出行更有趣</p></header><section class="block-body"><div class="row"><div class="col-sm-4" data-scroll-reveal="wait 0.2s, then enter top over 0.5s"><a href="yikeyboard.html" class="recent-work" style="background-image:url(public/assets/images/yikeyboard_320x240.jpg)" target="_blank"><span class="btn btn-o-white">彝文輸入法</span></a></div><div class="col-sm-4" data-scroll-reveal="wait 0.5s, then enter top over 0.5s"><a href="went0.html" class="recent-work" style="background-image:url(public/assets/images/WENT_320x240.jpg)" target="_blank"><span class="btn btn-o-white">行界：零</span></a></div><div class="col-sm-4" data-scroll-reveal="wait 0.8s, then enter top over 0.5s"><a href="impression.html" class="recent-work" style="background-image:url(public/assets/images/WUTpostcard_320x240.jpg)" target="_blank"><span class="btn btn-o-white">理工印象</span></a></div></div></section></div></div><div class="content-block parallax" id="services"><div class="container text-center"><header class="block-heading cleafix"><h1 data-scroll-reveal="wait 0.1s, then enter top over 0.5s">旗下項目</h1><p data-scroll-reveal="wait 0.1s, then enter top over 0.6s">我們做的一些事情。</p></header><section class="block-body"><div class="row"><div class="col-md-4"><div class="service"><i class="fa fa-send-o" data-scroll-reveal="wait 0.1s, then enter top over 0.5s"></i><br><br><h2 data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">游戲</h2><p data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">益行游戲致力于開發LBS游戲<br>希望您能在游戲中學到一些東西。</p></div></div><div class="col-md-4"><div class="service"><i class="fa fa-camera-retro" data-scroll-reveal="wait 0.1s, then enter top over 0.5s"></i><br><br><h2 data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">文化</h2><p data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">理工印象出品明信片、書簽、地圖、文化衫。<br>為你帶來身邊的風景、故事和回憶。</p></div></div><div class="col-md-4"><div class="service"><i class="fa fa-heart-o" data-scroll-reveal="wait 0.1s, then enter top over 0.5s"></i><br><br><h2 data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">支教</h2><p data-scroll-reveal="wait 0.1s, then enter bottom over 0.5s">益行人支教團已連續5年在貴州、廣西支教。<br>將盡全力給孩子們帶去知識與快樂。</p></div></div></div></section></div></div><div class="content-block" id="testimonials"><div class="container" data-scroll-reveal="wait 0.1s, then enter top over 0.5s"><header class="block-heading cleafix"><h1 data-scroll-reveal="wait 0.1s, then enter top over 0.5s">創業伙伴</h1><p data-scroll-reveal="wait 0.1s, then enter top over 0.6s">必須和你們介紹他們。</p></header><div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><div class="row" style="padding-left:10%; padding-right:10%;"><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_YJ_190x190.jpg"><p>益行游戲創始人，2013屆支教團馬區負責人，《行界》系列游戲制作人。負責產品設計及公司日常管理。</p><strong>楊峻</strong><br/><span>創始人&產品總監</span></div></div><div class="col-md-3" ><div class="testimonial"><img src="public/assets/images/testimonial_LY_190x190.png"><p>益行游戲聯合創始人，2014屆支教團馬區負責人，負責公司行政事務及財務管理。</p><strong>梁媛</strong><br/><span>聯合創始人&行政總監</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_DCY_190x190.jpg"><p>益行游戲聯合創始人，精通多種編程語言，自行車愛好者，鯨落樂隊的貝斯手。《嗨球》主策劃。</p><strong>杜承垚</strong><br/><span>聯合創始人&技術總監</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_SJY_190x190.png"><p>益行人公司聯合創始人，理工印象創始人。《益疊塔》主策劃。公司公認的最有情調的男人。</p><strong>盛俊陽</strong><br/><span>聯合創始人&商務總監</span></div></div></div></div><div class="item"><div class="row" style="padding-left:10%; padding-right:10%;"><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_SW_190x190.jpg"><p>業余死宅，酷愛游戲開發，熟悉Cocos2D-x以及Unity3D引擎及多種語言。《行界零》主程.</p><strong>邵威</strong><br/><span>高級游戲引擎工程師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_KK_190x190.jpg"><p>熟悉機器學習以及圖像處理等各種智能算法、熟悉多種后臺及客戶端開發語言。《行界零》后臺</p><strong>康康</strong><br/><span>算法工程師&后臺工程師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_YSK_190x190.jpg"><p>做飯非常好吃，鯨落樂隊的貝斯手。2013屆支教隊員，負責公司人事管理和游戲音樂！</p><strong>鄢守堃</strong><br/><span>人事總監</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_LL_190x190.jpg"><p>古靈精怪的設計師，總是左右為難的完美主義天秤座。《理工大地圖》、《行界零》主美術。</p><strong>盧力</strong><br/><span>美術總監</span></div></div></div></div><div class="item"><div class="row" style="padding-left:10%; padding-right:10%;"><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_ZY_190x190.png"><p>高冷的賣萌君，2014屆支教隊員，負責新媒體平臺的運營及管理。</p><br><strong>朱顏</strong><br/><span>媒體主管</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_ZT_190x190.png"><p>熱情開朗的妹子~數學建模國賽一等獎，理工印象新產品的策劃出品及對外合作。</p><strong>趙婷</strong><br/><span>理工印象主管</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_CTP_190x190.png"><p>半路出家的原畫師，專業死宅，要去日本的男人。參與《行界零》的原畫設計。</p><strong>曹天培</strong><br/><span>原畫師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_JYL_190x190.jpg"><p>風流倜儻的景大師，精通小說和書法。負責行界的世界觀、游戲策劃和游戲劇情編寫。</p><strong>景逸倫</strong><br/><span>游戲框架師</span></div></div></div></div><div class="item"><div class="row" style="padding-left:10%; padding-right:10%;"><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_JT_190x190.png"><p>充滿妖氣的江姐，鬼點子超多，正在努力成為交互設計師。2013屆支教團余區負責人。</p><strong>江濤</strong><br/><span>交互設計師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_ZH_190x190.jpg"><p>陽光帥氣的班長，精通多種編程語言。《嗨球》、《益疊塔》、《行界零》程序。</p><strong>張韓</strong><br/><span>技術主管</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_LJY_190x190.jpg"><p>CocoaChina翻譯組成員，《Xcode江湖錄》著作者，參與開發《益疊塔》、《行界零》。</p><strong>李俊陽</strong><br/><span>iOS工程師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_LZY_190x190.jpg"><p>新加入的程序員，程序方面什么都會，各種救火補BUG！正在參與開發《行界遺》。</p><strong>林治宇</strong><br/><span>高級軟件工程師</span></div></div></div></div><div class="item"><div class="row" style="padding-left:10%; padding-right:10%;"><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_QBJ_190x190.jpg"><p>天然呆的美術設計師，正在學游泳。負責《行界零》的遺跡設計。</p><strong>曲貝佳</strong><br/><span>平面設計師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_ZHH_190x190.png"><p>見多識廣的小伙，會文案、會美術、會代碼，負責游戲的策劃以及測試。（頭像是他自己畫的）。</p><strong>張浩浩</strong><br/><span>游戲策劃</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_GY_190x190.jpg"><p>溫柔大方的平面設計師，正在貴州支教一年。主導《益疊塔》、《理工大地圖》的美術設計。</p><strong>龔云</strong><br/><span>平面設計師</span></div></div><div class="col-md-3"><div class="testimonial"><img src="public/assets/images/testimonial_ZL_190x190.png"><p>熱情肯干的小伙，要成為船長的男人，負責余家頭校區理工印象、益行人小站的各項事務。</p><strong>朱林</strong><br/><span>理工印象余區主管</span></div></div></div></div></div><ol class="carousel-indicators"><li data-target="#myCarousel" data-slide-to="0" class="active"></li><li data-target="#myCarousel" data-slide-to="1"></li><li data-target="#myCarousel" data-slide-to="2"></li><li data-target="#myCarousel" data-slide-to="3"></li><li data-target="#myCarousel" data-slide-to="4"></li></ol><a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a><a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a></div></div></div><div class="content-block" id="footer"><div class="container"><div class="row"><div class="col-xs-12">© 2014-2017  武漢逸行靈動科技有限公司  |  鄂ICP備15000906號</div></div></div></div></div><script src="public/assets/js/jquery-2.1.3.min.js"></script><script src="public/assets/js/jquery-migrate-1.2.1.min.js"></script><script src="public/assets/js/bootstrap.min.js"></script><script src="public/assets/js/bootstrap.js"></script><script src="public/assets/js/jquery.actual.min.js"></script><script src="public/assets/js/jquery.scrollTo.min.js"></script><script src="public/assets/js/scrollReveal.js"></script><script src="public/assets/js/script.js"></script><script type="text/javascript">(function($) {'use strict';window.scrollReveal = new scrollReveal({reset: true,move: '50px'});})();</script> </body></html>

四、獲取更多源碼

~ 關注我，點贊博文~ 每天帶你漲知識!
相關問題可以相互學習，可關注↓公Z號獲取更多源碼 !

五、學習資料

web前端零基礎-入門到高級 (視頻+源碼+開發軟件+學習資料+面試題) 一整套 (教程)
適合入門到高級的童鞋們入手~送1000套HTML+CSS+JavaScript模板網站

六、更多源碼

HTML5期末考核大作業源碼* 包含個人、美食、公司、學校、旅游、電商、寵物、電器、茶葉、家居、酒店、舞蹈、動漫、明星、服裝、體育、化妝品、物流、環保、書籍、婚紗、軍事、游戲、節日、戒煙、電影、攝影、文化、家鄉、鮮花、禮品、汽車、其他可滿足大學生網頁大作業網頁設計需求, 喜歡的可以下載!

總結

以上是生活随笔為你收集整理的html简单个人网页制作网站设计——腾讯游戏官网(13页) HTML+CSS+JavaScript web网页设计与开发的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。