本文档介绍了如何编写TGBUS主页面的HTML代码，并实现了与官网相似的简单动态效果。需要自行下载官网图片并替换到相应路径。
主代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="yangshi.css">
</head>
<body>
<div class="q1">
<div class="zongti">
<!-- 游戏频道开始 -->
<div class="youxi clear">
<!-- 游戏频道第一个内容 -->
<div>
<!-- 标头 -->
<div class="d1 clear">
<div>
<nav>
<img src="image/ps4.png">
</nav>
</div>
<div class="d2">
<div><img src="image/ps5.png"></div>
</div>
</div>
<!-- 图片 -->
<div class="tu1">
<div><img src="image/20210714090307-2366-83044.jpg"></div>
<div>传闻称《对马岛之魂》新DLC壹岐岛内容疑似泄露</div>
</div>
<!-- 内容导航 -->
<div class="n1 clear">
<div>
<div><img src="image/20210715134159-1656-22550.jpg"></div>
<div>
<div>《柯娜：精神之桥》PS5自适应扳机功能展示</div>
<div>日前索尼公布了一段游戏的新预告片，展示了PS5 DualSense手柄的自适应扳机键对于《柯娜：精神之桥》等游戏的支持。</div>
</div>
</div>
<div>
<div><img src="image/20210715085229-1534-44053.jpg"></div>
<div>
<div>《漫威蜘蛛侠2》疑似进入动作捕捉的制作阶段</div>
<div>负责《漫威蜘蛛侠：迈尔斯·莫拉莱斯》动作捕捉的演员Nadji Jeter在社交平台上发布了一张照片，从照片上可以看出，Nadji穿了一身动作捕捉的设备，这或许是正在进行某个游戏的动作捕捉工作。</div>
</div>
</div>
<div>
<div><img src="image/20210715082558-8507-43127.jpg"></div>
<div>
<div>有传闻称数个PS平台独占主机游戏将登陆PC端</div>
<div>国外一位知名的数据矿工在社交平台上爆料称，数个PS平台独占的主机游戏即将移植到PC平台 。</div>
</div>
</div>
<div>
<div><img src="image/20210714142239-7595-68663.png"></div>
<div>
<div>《最后的生还者》电视剧集或将于明年开播</div>
<div>真人电视剧集《最后的生还者》已经正式开启了拍摄工作，本剧集预计将于2022年6月8日完成拍摄。</div>
</div>
</div>
<div>
<div><img src="image/20210714090307-2366-83044.jpg"></div>
<div>
<div>传闻称《对马岛之魂》新DLC壹岐岛内容疑似泄露</div>
<div>一位自称是专业测试人员的网友在社交论坛上发布了一篇自己测试的《对马岛之魂》中新DLC壹岐岛的拓展内容的文章。
</div>
</div>
</div>
</div>
<div class="d10">进入PS4频道</div>
</div>
<!-- 游戏频道第二个内容 -->
<div>
<!-- 标头 -->
<div class="d1 clear">
<div>
<nav class="c1">
<img src="image/switch.png">
</nav>
</div>
<div class="d2">
<div></div>
</div>
</div>
<!-- 图片 -->
<div class="tu2">
<div><img src="image/20210715084700-3746-41460.png"></div>
<div>任天堂公布《塞尔达传说：天空之剑HD》上市预告</div>
</div>
<!-- 内容导航 -->
<div class="n1 clear">
<div>
<div><img src="image/20210715134834-3285-46665.jpg"></div>
<div>
<div>Switch独占动作游戏《英雄不再3》全新预告</div>
<div>Switch独占动作游戏《英雄不再3》发布了全新预告，视频中展示了游戏的“重试轮盘”系统玩法。</div>
</div>
</div>
<div>
<div><img src="image/20210715133123-6518-95863.png"></div>
<div>
<div>《真女神转生5》最新PV公布 11月11日发售</div>
<div>Altus公布了《真女神转生5》的最新PV，视频中有多名角色亮相，并展示了激烈的战斗场景，本作将于2021年11月11日登陆Switch，游戏支持中文。</div>
</div>
</div>
<div>
<div><img src="image/20210715084907-5415-39383.png"></div>
<div>
<div>《真女神转生5》每日恶魔 神座搬运者座天使</div>
<div>《真女神转生5》最新的每日恶魔介绍宣传片公布，本期视频介绍的恶魔是「座天使」，本作将于2021年11月11日登陆Switch平台，游戏支持中文。</div>
</div>
</div>
<div>
<div><img src="image/20210715084700-3746-41460.png"></div>
<div>
<div>任天堂公布《塞尔达传说：天空之剑HD》上市预告</div>
<div>《塞尔达传说：天空之剑HD》上市预告片公布，本作将于7月16日登陆Switch平台。</div>
</div>
</div>
<div>
<div><img src="image/20210714135129-3700-92750.jpg"></div>
<div>
<div>《任天堂明星大乱斗》将和《天穗之咲稻姬》联动</div>
<div>《任天堂明星大乱斗：特别版》将于7月16日和《天穗之咲稻姬》进行联动，推出三款新命魂，本次活动将持续5天。
</div>
</div>
</div>
</div>
<div class="d10">进入Switch频道</div>
</div>
<!-- 游戏频道第三个内容 -->
<div>
<!-- 标头 -->
<div class="d1 clear">
<div>
<nav>
<img src="image/xbox-one.png">
</nav>
</div>
<div class="d2">
<div><img src="image/xboxseriesx.png"></div>
</div>
</div>
<!-- 图片 -->
<div class="tu3">
<div><img src="image/20210714101131-4179-73350.jpg"></div>
<div>《尼克儿童频道 全明星乱斗》今年秋季发售</div>
</div>
<!-- 内容导航 -->
<div class="n1 clear">
<div>
<div><img src="image/20210715090047-6453-69672.png"></div>
<div>
<div>菲尔•斯宾塞表示未来会对Xbox手柄进行改动</div>
<div>近日，Xbox 负责人菲尔•斯宾塞在节目中对DualSense手柄赞不绝口，并表示从中获得了启发。</div>
</div>
</div>
<div>
<div><img src="image/20210714093936-3679-28982.png"></div>
<div>
<div>《极限竞速：地平线5》公开最新汽车音效演示</div>
<div>Forza官方发布了赛车竞技游戏《极限竞速：地平线5》的最新实机演示，本次介绍的内容为相同型号赛车在新作和前作中的音效对比。</div>
</div>
</div>
<div>
<div><img src="image/20210713142721-4118-82669.jpg"></div>
<div>
<div>343工作室将与合作推出《光环百科全书》</div>
<div>《光环：无限》开发商343工作室宣布，将与黑马漫画合作推出近500页的《光环百科全书》，将在2022年春季2022年3月29日发售。</div>
</div>
</div>
<div>
<div><img src="image/20210708143735-7870-54856.jpg"></div>
<div>
<div>《我的世界》在韩国归为成人游戏 玩家须年满19岁</div>
<div>《我的世界》在韩国已经被归类为成人游戏，韩国本地玩家需要登陆Xbox Live账户才能进入《我的世界》，而且用户年龄必须在19岁以上。</div>
</div>
</div>
<div>
<div><img src="image/20210707141908-3005-55055.png"></div>
<div>
<div>微软开发DLSS技术 欲提升下一代游戏分辨率</div>
<div>微软开发DLSS技术，欲提升下一代游戏分辨率与帧率。
</div>
</div>
</div>
</div>
<div class="d10">进入Xbox频道</div>
</div>
</div>
</div>
</div>
<!-- 游戏频道结束 -->
<!-- 巴士游库开始 -->
<div class="d11">
<div class="d12">
<!-- 上面导航栏模块 -->
<div class="clear d13">
<div>巴士游库</div>
<div>欧美推荐</div>
<div>日系精选</div>
<div>国产游戏</div>
<div>游戏库</div>
</div>
<!-- 下面的图片模块 -->
<div class=
最低0.47元/天 解锁文章
扫一扫
3427
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
