QQ飞车官方网页项目答辩-CSDN博客

本文链接：https://blog.csdn.net/2401_87758868/article/details/146997273

QQ飞车官方首页

点击下面链接

**提取码的加我QQ：2315114034 **

https://pan.baidu.com/s/1T-hSKXzocr4Cr3YnvBQeBg

zhongzichao主页面
在这里插入图片描述

CSS外部引用

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>QQ飞车官方首页</title>
		<script src="js/jquery-1.12.2.js"></script>
		<style>
			/*下拉框效果*/
			#nr{
				position: fixed;
				width: 2553px;
				height: 97px;
				line-height: 97px;
				top: 0px;
				background: rgba(0, 0, 0, .6);  /*颜色渐变效果*/
				margin-left: 1px;	
				z-index: 1;
				margin: 0px auto;
			}
			.tt1{
				float: left;/*向上浮动*/
				width: 399px;
				line-height: 50px;
				font-size: 31px;
				text-align: center;
				list-style-type: none;
				top: 0px;
				color: #fff;
				margin-right: 9px;
			}
			.tt1 a{
				color:#fff;
				display: block;
				text-decoration: none;/*去圆点*/
				margin-top: -15px;
				margin: 0px auto;
				
			}
			.tt1 .bj:hover{
				background-color: aqua; /*背景颜色*/
				margin: 0px auto;
				
			}
			.tt2{
				list-style-type: none;
				width: 300px;
				background: rgba(0,0,0,0.6);  /*颜色渐变修改*/
				box-shadow: rgba(0, 0, 0, 0.6);
				display: none;
				margin: 0px auto;
				position: fixed;
				top: 62px;
				transition: all 2s linear;
			}
			.tt2 li{
				height: 80px;
			}
			#eu{
				width: 200px;
				height: 90px;
				position: absolute;
				top: 0px;
				left: 0px;
			}
			.hrwc{
				list-style: none;
			}
			.tt1:hover .tt2{
				display: block;
				margin: 0px auto;
				
			}
			.jb:hover{
				color: aqua;
				margin: 0px auto;
			}
			.jb{
				margin-left: -40px;
				line-height: 60px;
				font-size: 17px;
				margin: 0px auto;
			}
			/*......................*/
			
			
			
			
			
			/* 盒子框架 */
			#hrc{
				width: 4000px;
				height: 100px;
				margin: 0px auto;
			}
			#eqiwfh{
				width: 2565px;
				height: 100px;
				margin: 0px auto;
			}
			#parent {
				width: 2560px;
				height: 2696px;
				/*网页居中*/
				margin: 0px auto;
				/*背景图片*/
				background-image: url(img/br.webp);
				/*图片不填充效果*/
				background-repeat: no-repeat; 
			}
			/* ............................... */
			
			
			
			
			
			/*轮播图效果*/
			#myA {
				width: 840px;
				height: 448px;
				/* 页面居中 */
				margin: 0px auto;
				/* 相对定位 */
				position: relative;
			}
			#myB ul{
				width: 840px;
				margin-left: 20px;
				padding: 0px;
			}
			#myB li {
				width: 840px;
				height: 425px;
				background-image: url(img/xm1.jpeg);
				list-style: none;
				margin-top: -12px;
				margin-left: -17px;
			}
			#left {
				position: absolute;
				left: 0px;
				top: 176px;
				height: 70px;
				width: 50px;
				background: url(img/arrows.png) no-repeat 0 0;
			}
			
			#left:hover {
				background: url(img/arrows.png) no-repeat 0 -70px;
			}
			#right {
				position: absolute;
				right: 40px;
				top: 173px;
				height: 70px;
				width: 50px;
				background: url(img/arrows.png) no-repeat -80px 0;
			}
			
			#right:hover {
				background: url(img/arrows.png) no-repeat -80px -70px;
			}
			
			#bottom li {
				height: 99px;
				width: 10px;
				float: left;
				margin-left: 30px;
				font-size: 60px;
			}
			
			#bottom li:hover {
				color: blue;
			}
			
			#bottom {
				position: absolute;
				left: 264px;
				bottom: -28px;
			}
			/* ................. */
			
			
			
		    
			
			/* 第二个轮播图效果 */
			#first {
				width: 100%;
				height: 900px;
				/* 相对定位 */
				position: relative;
			}
			#secend {
				width: 100%;
				height: 2220px;
			}
			#first_01 {
				width: 1364px;
				height: 430px;
				position: absolute;
				bottom: 0px;
				left: 600px;
			}
			#first_01_left {
				width: 840px;
				height: 425px;
				float: left;
			}
			#first_01_right {
				width: 520px;
				height: 431px;
				float: right;
				/*背景图片*/
				background-image: url(img/news.webp);
			}
			#secend_01 {
				width: 1364px;
				margin: 0px auto;
			}
			#first_01_right_top{
				width: 520px;
				height: 50px;
				float: right;
			}
			#first_01_right_top li{
				float: left;
				list-style: none;
				margin-left: 85px;
				position: relative;
				right: 58px;
				color: white;
			}
			#first_01_right_bottom .box{
				width: 520px;
				height: 429px;
			}
			#fhsfjsd{
				width: 5000px;
				height: 331.33px;
				margin: 0px auto;
				position: absolute;
				top: 2322px;
				left: -1747px;
				background-color:#e6e6e6
			}
			#lkj{
				margin: 436px auto;
				width: 1360px;
				height: 660px;
			}
			#ty{
				width: 880px;
				height: 100px;
			}
			#hzi{
				width: 890px;
				height: 653px;
			}
			#pink{
				float: right;
				margin: -655px auto;
				width: 463px;
				height: 653px;
			}
			.jhd{
				float: right;
				position: relative;
				top: -96px;
				left: 61px;
			}
			#yui{
				width: 1360px;
				height: 660px;
				position: absolute;
				bottom: 0px;
				top: 1104px;
			}
			#hj{
				width: 890px;
				height: 653px;
			}
			#io{
				width: 880px;
				height: 100px;
			}
			#ytr{
				width: 539px;
				height: 541px;
				position: absolute;
				top: 107px;
				left: 343px;
			}
			#wsx{
				width: 533px;
				height: 73px;
			}
			#jhg{
				width: 458px;
				height: 100px;
			}
			.kj{
				margin-top: -34px;
			}
			.sy{
				position: relative;
				top: -31px;
				right: -211px;
				color: #9fc2e8;
			}
			.zzc{
				position: relative;
				top: 21px;
				left: 95px;
				font-size: 20px;
				color: #28b6ff;
			}
			.zzc:hover{
				text-decoration: underline;/*下划线*/
			}
			.lisd{
				line-height: 38px;
				margin-left: 17px;
				position: relative;
				top: 36px;
				color: #b6c6d1;
			}
			.lisd:hover{
				text-decoration: underline;/*下划线*/
			}
			.hd{
				color: #28b6ff;
			}
			/* .............。。。。 */
			
			
			
			
			#wxh{
				list-style: none;
			}
			.xy{
				float: left;
				padding: 0px;
				margin-left: 77px;
				margin-top: 49px;
			}
			#wxh li:hover{
				transform: scale(2.5);/*点击图片放大效果*/
			}
			.xy:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			#ree_1{
				float: left;
				padding-right: 11px;
			}
			#ree_1 img:hover{
				transform: scale(1.2);
			}	
			#po img:hover{
				transform: scale(1.2);
			}	
			.qaz1{
				float: right; /*浮动*/
				margin-top: -151px;
				padding-right: 1px;
			}
			.qaz2{
				float: right;
				margin-top: -77px;
				padding-right: 1px;
			}
			.bb1{
				position: relative;
				top: -111px;
				left: 122px;
				font-size: 30px;
				font-weight: 900;
				color: brown;
			}
			.bb2{
				position: relative;
				font-size: 14px;
				top: -87px;
				left: 18px;
				color: brown;
			}
			.bb3{
				position: relative;
				top: -139px;
				left: 160px;
				color: white;
			}
			.bb4{
				position: relative;
				top: -68px;
				left: 94px;
				color: white;
			}
			.bb5{
				position: relative;
				left: 22px;
			}
			
		    .gjur{
				margin-top: 153px;
				position: absolute;
				right: 9px;
			}
			.lkio_1{
				position: relative;
				top: 349px;
				left: 18px;
			}
			.lkio_2{
				position: relative;
				top: -50px;
				color: #8498af;
				
			}
			.lkio_3{
				position: relative;
				top: -20px;
				left: -89px;
				color: #5b6e97;
				font-size: 20px;
				font-weight: bold;
			}
			.lkio_4{
				position: relative;
				top: 242px;
				left: 234px;
			}
			.lkio_5{
				position: relative;
				top: -49px;
				color: #8498af;
			}
			.lkio_6{
				position: relative;
				top: -17px;
				left: -89px;
				color: #5b6e97;
				font-size: 20px;
				font-weight: bold;
			}
			.lkio_7{
				
				position: relative;
				right: -5px;
				top: -220px;
			}
			.lkio_8{
				margin-top: -333px;
				position: relative;
				right: -15px;
			}
			.lkio_9{
				margin-top: -78px;
				position: relative;
				right: -19px;
			}
			.lkio_10{
				
				position: relative;
				right: -17px;
				top: -28px;
			}
			.lkio_11{
				color: #28b6ff;
			}
			.lkio_12{
				position: relative;
				right: -269px;
				top: -60px;
			}
			.lkio_13{
				position: relative;
				right: -4px;
				top: 5px;
			}
			#qgg{
				list-style: none;
			}
			.mm1{
				float: left;
				padding: 0px;
				margin-left: 105px;
				margin-top: 27px;
			}
			.mm1:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			#qgg li:hover{
				transform: scale(2.5);
			}
			#wai{
				position: absolute;
				top: 211px;
			}
			#wai img:hover{
				transform: scale(1.5);
			}
			h2{
				color: #28b6ff;
				text-align: center;
				padding: 0px;
			}
			h2:hover{
				text-decoration: underline;/*下划线*/
			}
			.tgv{
				list-style: none;
				line-height: 59px;
				color: #656565;
				font-size: 20px;
			}
			.tgv li:hover{
				transform: scale(1.2);
			}
			.lmn:hover{
				text-decoration: underline;/*下划线*/
			}
			h4{
				text-align: center;
				margin-top: 32px;
				font-size: 30px;
			}
			.tyg{
				width: 431px;
				height: 147px;
				margin: 0px auto;
				background-image: url(img/ce5726511e7aaa77ab810090e5ef41a2.jpeg);
				margin-top: 98px;
			}
			.axc{
				width: 431px;
				height: 147px;
				margin: 0px auto;
				background-image: url(img/8b8bc0d24f29eaa733f926b407069aa2.jpeg);
				margin-top: 94px;
			}
			#lzy{
				list-style: none;
			}
			
			
			.left2{
				float: right;
				position: absolute;
				top: -255px;
			}
		    #mj{
				width: 473px;
				height: 152px;
				float: right;
				margin-top: 23px;
			}
			.xs{
				margin-top: -152px;
				margin-left: 330px;
			}
			.xs_2{
				margin-left: 330px;
			}
			.s{
				font-size: 30px;
				position: absolute;
				top: 502px;
				margin-left: -214px;
				font-weight: 900;
			}
			.wqsa_1{
				position: absolute;
				top: 129px;
				left: -366px;
			}
			.wqsa_2{
				position: absolute;
				top: 126px;
				left: 6px;
			}
			.wqsa_3{
				position: absolute;
				top: 129px;
				left: 420px;
			}
			.wqsa_4{
				margin-left: 1133px;
				position: absolute;
				top: 115px;
			}
			
			
			/* 视频部分 */
			#as{
				float: right;
				margin: -655px auto;
				width: 463px;
				height: 653px;
			}
			#rfd{
				position: absolute;
				top: 1776px;
				width: 1360px;
				height: 437px;
			}
			#sdf{
				width: 1360px;
				height: 100px;
				margin-left: -74px;
			}
			.lzy1{
				list-style: none;
				float: left;
				line-height: 10px;
				margin: -37px auto;
				padding: 64px;
				font-size: 30px;
			}
			.lzy1:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			#xlxy{
				width: 250px;
				height: 100px;
				margin: 0px auto;
			}
			.wbzd{
				list-style: none;
			}
			.wbzd1{
				position: absolute;
				top: 394px;
				left: -117px;
			}
			.wbzd1:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			.wbzd2{
				position: absolute;
				top: 394px;
				left: 262px;
			}
			.wbzd2:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			.wbzd3{
				position: absolute;
				top: 394px;
				left: 659px;
			}
			.wbzd3:hover{
				text-decoration: underline;/*下划线*/
				color: #28b6ff;
			}
			
			
			/* 底部 */
		    .zcy{
				width: 500px;
				height: 100px;
			}
		    .wbsr{
				list-style: none;
				margin: 0px auto;
				position: absolute;
				top: 59px;
				left: 2233px;
				line-height: 33px;
			}
			#gf_1{
				position: absolute;
				top: 135px;
				left: 1634px;
			}
			#gf_2{
				position: absolute;
				top: 128px;
				left: 2098px;
			}
			#gf_3{
				position: absolute;
				top: 130px;
				left: 1934px;
			}
			#gf_4{
				position: absolute;
				top: 266px;
				left: 2275px;
			}
			/*...................*/
			
			
			
			/*返回顶部*/
			#myE{
				position: sticky;
				margin-top: -246px;
				margin-left: 1500px;
			}
		</style>
	</head>

内部样式

<body>
<h1 id="mop"></h1>
<div id="hrc"></div>
	<div id="eqiwfh">
	<div id="nr">
		<ul class="tt"></ul>
		<li class="tt1">游戏资料
			<ul class="tt2">
				<li>新手指引</li>
				<li>官方遏画</li>
				<li>高清壁纸</li>
				<li>游戏下载</li>
				<li>飞车手游</li>
			</ul>
		</li>
		
		<ul class="tt"></ul>
		<a href="../hujoiaxin/hjx2.html" target="_blank"><li class="tt1">赛事中心</a>
			<ul class="tt2">
				<li>谁是车王</li>
				<li>SSC</li>
				<li>全国公开赛</li>
			</ul>
		</li>
		<ul class="tt"></ul>
		<li class="tt1"><a href="../fengliuxiangyu/second.html" target="_blank">活动中心</a>
			<ul class="tt2">
				<li>版本专区四</li>
				<li>合作区</li>
			</ul>
		</li>
		<ul class="tt"></ul>
		<li class="tt1">更多
			<ul class="tt2">
				<li>戴钻专区</li>
				<li>道聚城</li>
				<li>点劵充值</li>
			</ul>
		</li>
		<ul class="tt"></ul>
		<li class="tt1">商城专区
			<ul class="tt2">
				<li>教学视频</li>
				<li>视频中心</li>
			</ul>
		</li>
		<ul class="tt"></ul>
		<li class="tt1"><a href="../tangyi/index.html" target="_blank">官方论坛</a>
			<ul class="tt2">
				<li>视频直播</li>
				<li>官方微信</li>
				<li>官方微博</li>
			</ul>	
		</li>
		</div>
	</div>
<div id="parent">
<!-- 顶部div -->
	<div id="first">
	<!-- 定位 -->
		<div id="first_01">
			<div id="first_01_left">
				<div id="myA">
					<div id="myB">
						<ul>
							<li></li>
						</ul>
						</div>
							<div id="left" onclick="prev()"></div>
							<div id="right" onclick="next()"></div>
						</div>
						<div id="bottom">
						<ul>
							<li></li>
							<li></li>
							<li></li>
							<li></li>
							<li></li>
							<li></li>
							<li></li>
						</ul>
					</div>
				</div>
				<div id="first_01_right">
					<div id="first_01_right_top">
						<ul>
							<li>综台</li>
							<li>活动</li>
							<li>公告</li>
							<li>赛事</li>
						</ul>
					</div>
					<div id="first_01_right_bottom">
						<div class="box" style="display: block;">
							<span class="zzc">青龙战姬次元先锋,首发[X次元]机娘赛.</span> <br />
							<span class="lisd"><span class="hd">[活动]</span>传世神兵斩岳断川,首发传世神兵系列赛车皮肤[终极暴].</span> <br />
							<span class="lisd"><span class="hd">[活动]</span>龙年限定至尊级5车[至尊影龙]重磅返场，四款山海神</span>.<br />
							<span class="lisd"><span class="hd">[活动]</span>雷霆寮宇无上裁决,首发希腊十二神系列赛车皮肤[众神.</span> <br />
							<span class="lisd"><span class="hd">[活动]</span>雷霆寮宇无上裁决,首发希腊十二神系列赛车皮肤[众神. </span><br />
							<span class="lisd"><span class="hd">[活动]</span>神汇聚至高殿堂,【诸神之战】系列赛车质肤惊吉返场!.</span> <br />
							<span class="lisd"><span class="hd">[活动]</span>小麦收割机轰鸣出动,精选极品A车四连发!</span>
						</div>
					<div class="box" style="display: none;">
						<span class="zzc">青龙战姬次元先锋,首发[X次元]机娘赛.</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>传世神兵斩岳断川,首发传世神兵系列赛车皮肤[终极暴].</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>龙年限定至尊级5车[至尊影龙]重磅返场，四款山海神</span>.<br />
						<span class="lisd"><span class="hd">[活动]</span>雷霆寮宇无上裁决,首发希腊十二神系列赛车皮肤[众神.</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>雷霆寮宇无上裁决,首发希腊十二神系列赛车皮肤[众神. </span><br />
						<span class="lisd"><span class="hd">[活动]</span>神汇聚至高殿堂,【诸神之战】系列赛车质肤惊吉返场!.</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>小麦收割机轰鸣出动,精选极品A车四连发!</span>
					</div>
					<div class="box" style="display: none;">
						<span class="zzc">关于严厉打击外挂的公告及封号名单</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>[X次元-青龙】赛车皮陕异常修复公告</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>关于不再支持32位客户端登录的公告</span>.<br />
						<span class="lisd"><span class="hd">[活动]</span>12月12日不停机更新公告</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>【筑梦合约】活动道具异常修复公告 </span><br />
						<span class="lisd"><span class="hd">[活动]</span>关于严厉打击外挂的公告及封号名单</span> <br />
						<span class="lisd"><span class="hd">[活动]</span>点券、幸运币月未清空公告--11月</span>
					</div>
					<div class="box" style="display: none;">
						<span class="zzc">车王S18总决赛 张云彬四连冠书写不朽传奇</span> <br />
						<span class="lisd"><span class="hd">[谁是车王]</span>车王518总决赛 张云彬气势如虹进击冠军赛</span> <br />
						<span class="lisd"><span class="hd">[谁是车王]</span>车王518总决赛 江章间率先夺得冠军赛席位</span>.<br />
						<span class="lisd"><span class="hd">[谁是车王]</span>车王518淘汰赛第二轮 四强名额尘埃落定</span> <br />
						<span class="lisd"><span class="hd">[谁是车王]</span>谁是车王518总决赛观赛福利 黑域电魔。全新专居背景精.. </span><br />
						<span class="lisd"><span class="hd">[谁是车王]</span>谁是车王518总决赛预热 四强名单重磅出炉</span> <br />
						<span class="lisd"><span class="hd">[谁是车王]</span>车王518淘汰赛第一轮 郭伟强势習级总决赛</span>
					</div>
					<div class="kj"><img src="img/more.webp" /><span class="sy">更多资讯+</span></div>
				</div>
			</div>
			<!-- 底部 -->
			<div id="secend">
				<div id="lkj">
					<div id="hzi">
						<div id="ty">
							<ul id="wxh">
								<li class="xy">活动</li>
								<li class="xy">正在进行</li>
								<li class="xy">免费福利</li>
								<li class="xy">商城特惠</li>
								<li class="xy">长期活动</li>
								<li class="xy">更多+</li>
							</ul>
						</div>
						<hr />
						<div id="ree_1">
							<img src="img/hd1.jpeg"/>
						</div>
						<div id="po">
							<img  src="img/hd2.jpeg"/>
						</div>
						<div id="ree_1">
							<img src="img/hd5.jpeg"/>
						</div>
						<div id="po">
							<img  src="img/hd4.jpeg"/>
						</div>
						</div>
						<div id="pink">
							<div class="bb5">
								<img src="img/btn_game.webp"/>
							</div>
							<span class="bb1">游戏介绍</span><span class="bb2">DOWNLOAD</span>
							<div class="qaz1">
								<img src="img/btn1.webp"/>
							</div>
							<span class="bb3">补丁下载</span>
							<div class="qaz2">
								<img src="img/btn2.webp"/>
							</div>
							<span class="bb4">紫钻专区</span>
							<span class="jhd">
								<img src="img/tps.png"/>
							</span>
							<div class="gjur">
								<img src="img/r_lan.webp" width="450px" />
							</div>
							<div class="lkio_1">
								<img src="img/ewm_l.webp" width="100px" height="100px" />
								<span class="lkio_2">掌飞全面升级</span><span class="lkio_3">扫码下载</span>
							</div>
							<div class="lkio_4">
								<img src="img/ewm_r.webp" width="100px" height="100px" />
								<span class="lkio_5">公众号送豪礼</span><span class="lkio_6">扫码关注</span>
							</div>
							<div class="lkio_7">
								<img src="img/pic1.webp" width="450px" />
							</div>
							<div  class="lkio_8">
								<img src="img/head_bg (1).webp"/>
							</div>
							<div  class="lkio_9">
								<img src="img/head.webp"/>
								<span  class="lkio_10">欢迎 
								<a href="./K05.html" target="_blank">
								<span  class="lkio_11">登录</span>
								</a></span>
							</div>
							<div class="lkio_12">
								<img src="img/zp5.png" alt="" />
							</div>
							<div class="lkio_13">
								<img src="img/zp3.png" width="450px" />
							</div>
						</div>
					</div>
					<div id="yui">
						<div id="hj">
							<div id="io">
								<hr />
								<ul id="qgg">
									<li class="mm1">赛事</li>
									<li class="mm1">谁是车王</li>
									<li class="mm1">全国公开赛</li>
									<li class="mm1">SSC</li>
									<li class="mm1">更多+</li>
								</ul>
								<div id="wai">
									<img src="img/cat.webp" alt="" />
								</div>
								<div id="ytr">
									<div id="wsx">
										<h2>车王S18总决赛张云彬四连冠书写不朽传奇</h2>
										<hr />
									</div>
									<ul class="tgv">
										<li class="lmn">车王518总决赛张云彬四连冠书写不朽传奇</li>
										<li  class="lmn">车王518总决赛张云彬气势如虹进击冠军赛</li>
										<li  class="lmn">车王518总决赛江章间率先夺得冠军赛席位</li>
										<li  class="lmn">车王518淘汰赛第二轮四强名额尘埃落定</li>
										<li  class="lmn">谁是车王518总决赛观赛福利黑域电魔、全新专属背录精彩大放送</li>
									</ul>
								</div>
							</div>
						</div>
						<div id="as">
							<div id="jhg">
								<h4>--版本相关--</h4>
								<div class="tyg"></div>
								<div class="axc"></div>
							</div>
						</div>
					</div>
					<div id="rfd">
						<div id="sdf">
							<div class="zhizi">
								<ul class="lzy">
									<li class="lzy1">视频</li>
									<li class="lzy1">最新</li>
									<li class="lzy1">推荐</li>
									<li class="lzy1">教学</li>
									<li class="lzy1">赛车</li>
									<li class="lzy1">赛事</li>
									<li class="lzy1">官方</li>
								</ul>
							</div>
							<div>
								<a  href="./K02.html" target="_blank">
									<div class="wqsa_1"><video src="video/4491e04e44201b9e376a63b776306e66.mp4" 
									width="820px" height="250px"></video>
									</div>
								</a>
								<a href="./K03.html" target="_blank">
									<div class="wqsa_2"><video src="video/509d849f14dae4e5c1f467c1a694ff75.mp4" 
									width="840px" height="250px"></video>
									</div>
								</a>
								<a href="./K04.html" target="_blank">
									<div class="wqsa_3"><video src="video/8c2f1ab35eed3f9aa312d4f7517236ff.mp4" 
									width="840px" height="250px"></video></div>
									<div>
								</a>
								<div class="wqsa_4">
									<video autoplay controls width="400px" height="265px">
										<source src="video/gw.mp4" />
									</video>
								</div>
								<ul class="wbzd">
									<li class="wbzd1">[赛道之王]桀弩流、欧尼花落夏海1.44.63(D)</li>
									<li class="wbzd2">[飞驰之王]桀骜流、欧尼极速列车1.21.48(A)</li>
									<li class="wbzd3">一休:最强5级机甲车X次元-青龙完整版大喷特效。</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
					<div id="secend_01">
						<div id="fhsfjsd">
							<div id="gf_1">
								<img src="img/logo4.webp" alt="" />
							</div>
							<div id="gf_2">
								<img src="img/logo3.webp" alt="" />
							</div>
							<div id="gf_3">
								<img src="img/logo2.webp" alt="" />
							</div>
							<div id="gf_4">
								<img src="img/gswj.webp" alt="" />
							</div>
							<ul class="wbsr">
								<li>腾讯互动娱乐|服务条款|隐私保护指引儿童隐私保护指引腾讯游戏招聘|腾讯游戏客服|游戏列表|广告服务及商务合作</li>
								<li>腾讯公司版权所有 网络游戏行业防沉迷自律公约</li>
								<li>COPYRIGHT ◎ 1998 -2024 TENCENT. ALL RIGHTS RESERVED.</li>
								<li>著作权人:腾讯科技(深圳)有限公司出版单位:深圳市腾讯计算机系统有限公司</li>
								<li>温馨提示:本游戏适合16岁(含)以上玩家娱乐;请您确定已如实进行实名注册;为了您的健康，请合理控制游戏时间。</li>
								<li>扺制不良游戏 拒绝盜版游戏 注意自我保护 谨防受骟上当 适度游戏益脑 沉游戏伤 合理安排时间 享受健康生活</li>
								<li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工商网监电子标识|粤网文[2023]2882-203号|(署)网出证(粤)字第054号</li>
							</ul>
						</div>
					</div>
				</div>
					<div id="myE">
						<a href="#mop" target="_parent">
						<img src="img/fhdb.png" width="200px" height="200px" />
						</a>
					</div>
				</div>
			</body>
			
			/*轮播图*/
		<script>
			num = 1;
			$("#bottom li").eq(num - 1).css("color", "skyblue");
			var el = $("#bottom li").eq(num - 1);
			el.css("color", "skyblue");
			$("#bottom li").not(el).css("color", "black");

			function next() {
				if (num == 7) {
					num = 1;
				} else {
					num++;
				}
				$("#myB li").css("background", "url(img/xm" + num + ".jpeg)");
				var el = $("#bottom li").eq(num - 1);
				el.css("color", "skyblue");
				$("#bottom li").not(el).css("color", "black");
			}

			function prev() {
				if (num == 1) {
					num = 7;
				} else {
					num--;
				}
				$("#myB li").css("background", "url(img/xm" + num + ".jpeg)");
				var el = $("#bottom li").eq(num - 1);
				el.css("color", "skyblue");
				$("#bottom li").not(el).css("color", "black");
			}
			$(function() {
				$("#bottom li").click(function() {
					//获取当前的下标(下标从0开始)
					num = $(this).index() + 1;
					//修改背景图片
					$("#myB li").css("background", "url(img/xm" + num + ".jpeg)");
					var el = $("#bottom li").eq(num - 1);
					el.css("color", "skyblue");
					$("#bottom li").not(el).css("color", "black");
				})
				setInterval("next()", 2000); //循环定时器
				
				
				$("#first_01_right_top li").mouseover(function(){
					var index = $(this).index();  //获取下标
					console.log(index);
					var divs = $("#first_01_right_bottom").children(".box"); //获取.neirong的所有子元素
					console.log(divs);
					divs.eq(index).attr("style","display:block;color: #28b6ff;"); //显示当前
					var cel = $(divs.eq(index));  //当前节点
					divs.not(cel).attr("style","display:none;");  //隐藏其他
					
					//当前的背景颜色
					$(this).css({"color":"#28b6ff"});
					//其他的背景颜色
					$(this).parent().children().not($(this)).css({"color":"white"});
					
				})
			})
	</script>
</html>

在这里插入图片描述

zhongzichao子页面

一、赛道之王视频

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>[赛道之王]桀弩流、欧尼花落夏海1.44.63(D</title>
	</head>
	<body>
		<div>
			<video autoplay controls width="2300px" height="1250px">
				<source src="video/c1.mp4" />
			</video>
		</div>
	</body>
</html>

二、飞驰之王

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>[飞驰之王]桀骜流、欧尼极速列车1.21.48(A)</title>
	</head>
	<body>
		<div>
			<video autoplay controls width="2300px" height="1250px">
				<source src="video/a4fdb008a7f5c89306a5f99918200842.mp4" />
			</video>
		</div>
	</body>
</html>

三、青龙完整版大喷特效

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>一休:最强5级机甲车X次元-青龙完整版大喷特效。</title>
	</head>
	<body>
		<div>
			<video autoplay controls width="2300px" height="1250px">
				<source src="video/8c2f1ab35eed3f9aa312d4f7517236ff.mp4" />
			</video>
		</div>
	</body>
</html>

四、登录页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页面</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        html {
            height: 100%;
        }
        body {
            height: 100%;
        }
        .container {
            height: 100%;
            background-image: linear-gradient(to right, #fbc2eb, #a6c1ee);
			background-image: url(img/ui.jpg);
			background-size: cover;
        }
        .login-wrapper {
            background-color: #fff;
            width: 358px;
            height: 588px;
            border-radius: 15px;
            padding: 0 50px;
            position: relative;
            left: 26%;
            top: 50%;
            transform: translate(-50%, -50%);
			background-image: url(img/kl.jpg);
        }
        .header {
            font-size: 38px;
            font-weight: bold;
            text-align: center;
            line-height: 200px;
        }
        .input-item {
            display: block;
            width: 100%;
            margin-bottom: 20px;
            border: 0;
            padding: 10px;
            border-bottom: 1px solid rgb(128, 125, 125);
            font-size: 15px;
            outline: none;
        }
        .input-item:placeholder {
            text-transform: uppercase;
        }
        .btn {
            text-align: center;
            padding: 10px;
            width: 100%;
            margin-top: 40px;
            background-image: linear-gradient(to right, #a6c1ee, #fbc2eb);
			background-image: url(img/tr.jpg);
            color: #fff;
        }
        .msg {
            text-align: center;
            line-height: 88px;
        }
        a {
            text-decoration-line: none;
            color: black;
        }
		i:hover{
			text-decoration: underline;
		}
		span:hover{
			text-decoration: underline;
		}
</style>
</head>
<body>
    <div class="container">
        <div class="login-wrapper">
            <div class="header"><img src="img/rt.jpg" width="50px" height="50px" />QQ飞车官网</div>
            <div class="form-wrapper">
                <input type="text" name="账号:" placeholder="例如:2314115034" class="input-item" >
                <input type="password" name="密码:" placeholder="密码:" required pattern="[a-zA-Z0-9_](6-20)" class="input-item">
                <a href="./K01zhongzichao.html" target="_blank"><div class="btn" ><input type="submit" />登录</div></a>
            </div>
            <div class="msg">
                用其他登录:
                <a href="#"><i>QQ</i>、<i>微信</i></a>
            </div>
        </div>
    </div>
</body>
</html>

在这里插入图片描述

1、成员子页面hjx

QQ飞车游戏赛事

在这里插入图片描述

CSS外部样式

<style>
			#myA{
				width: 2564px;
				height: 5000px;
				margin: 0px auto;
				background-image: url(img/wrap-cont.webp);
				padding: 0px;
				background-repeat: no-repeat;
				background-size: cover;
			}
			#myB{
				background-color: white;
				z-index: 1;
			}
			#myC{
				width: 2564px;
				height: 130px;
				background: rgba(0, 0, 0, .6);
				position: fixed;
				top: 0px;
			}
			#myC img{
				margin-left:110px;
				vertical-align: middle;
			}
			#myC span{
				font-size: 40px;
				color: aliceblue;
				display: inline-block;
				width: 273px;
				height: 134px;
				line-height: 134px;
				margin-left: 75px;
			}
			#myC span:hover{
				background: url(img/btn.gif) no-repeat;
			}
			#myD{
				background: url(img/head.jpg);
				width: 2564px;
				height:1050px;
				background-size: cover;
			}
			#myE{
				margin: 0px auto;
				width: 1900px;
				height: 100px;
				font-size: 40px;
			}
			#myF{
				background: url(img/fuli-bg1.webp);
				margin: 0px auto;
				width: 1700px;
				height: 1000px;
				background-size: cover;
			}
			#mya{
				text-align: center;
				margin: 60px auto;
				width: 184px;
				height: 26px;
				background: url(img/qdjl-title.png);
			}
			#myb{
				width: 1600px;
			}
			#myb ul{
				width: 1600px;
				height: 400px;
			}
			#myb li{
				color: aliceblue;
				height: 300px;
				width: 311px;
				font-size: 20px;
				float: left;
				margin-left: 60px;
				list-style: none;
				background: url(img/dj-bg.webp);
				background-size: cover;
				background-repeat: no-repeat;
				text-align: center;
				margin-top: -20px;
			}
			.myZ_1{
				font-size: 33px;
			}
			#myZ{
				text-align: center;
				border: 1px red solid;
				margin: 60px auto;
				width: 285px;
				background-size: cover;
				height: 27px;
				background: url(img/dmcj-title.png);
			}
			#bb{
				width: 1600px;
			}
			#bb ul{
				width: 1500px;
				height: 400px;
			}
			#bb li{
				color: aliceblue;
				height: 300px;
				width: 311px;
				font-size: 20px;
				float: left;
				margin-left: 60px;
				list-style: none;
				background: url(img/dj-bg.webp);
				background-size: cover;
				background-repeat: no-repeat;
				text-align: center;
				margin-top: -20px;
			}
			#myG{
				margin: 0px auto;
				width: 1800px;
				height: 1450px;
			}
			#cc{
				
				margin: 40px auto;
				width: 1900px;
				height: 50px;
				font-size: 40px;
				background-repeat: no-repeat;
				background-size: cover;
			}
			#dd h3{
				font-size: 35px;
				margin: 0px;
				margin-bottom: 20px;
			}
			#dd{
				text-align: center;
			}
			#dd ul{
				padding: 0px;
				margin-left: 150px;
				float: left;
			}
			#dd li{
				margin-top: 20px;
				font-size:25px;
				list-style: none;
			}
			#myH{
				margin: 0px auto;
				margin-top: 80px;
				width: 1920px;
				height: 470px;
			}
			#hh img{
				float: left;
				margin-right: 80px;
			}
			#ll{
				font-size: 30px;
			}
			#secend_01 {
				width: 1364px;
				height: 300px;
				margin: 0px auto;
			}
			#fhsfjsd{
				width: 2594px;
				height: 331.33px;
				margin: 0px auto;
				position: absolute;
				top: 5007px;
				left: 0px;
				background-color:#e6e6e6;
			}
			#gf_1{
				position: absolute;
				top: 135px;
				left: 472px;
			}
			#gf_2{
				position: absolute;
				top: 128px;
				left: 942px;
			}
			#gf_3{
				position: absolute;
				top: 130px;
				left: 775px;
			}
			#gf_4{
				position: absolute;
				top: 266px;
				left: 1142px;
			}
			.wbsr{
				list-style: none;
				margin: 0px auto;
				position: absolute;
				top: 59px;
				left: 1100px;
				line-height: 33px;
			}
			#mym{
				
				position: sticky;
				margin-top: -246px;
				margin-left: 2000px;
			}
		</style>

hmtl内部代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>QQ飞车游戏赛事</title>
	</head>
	<body>
		<h1 id="mop"></h1>
		<div id="myA">
			<!-- 顶部第一个 -->
			<div id="myC">
				<img src="img/logo.webp" width="130px" height="100px"/>
				<a href="../zhongzichao/K01zhongzichao.html"><span>官方首页</span></a>
				<span>萌新大礼</span>
				<span>7月签到</span>
				<span>帝皇现世</span>
				<span>合金车模</span>
				<span>童趣夺宝</span>
			</div>
			<div id="myD"></div>
			<div id="myE">
				超值福利
			</div>
			<div id="myF">
				<div id="mya"></div>
				<div id="myb">
					<ul>
						<li>
							<img src="img/fcdq.webp" width="244px"/><br><br>飞车点券
						</li>
						<li>
							<img src="img/fhzz.png" width="220px"/><br><br>点火装置+1
						</li>
						<li><img src="img/lyzs.webp" width="266px"/><br><br>T2亡灵收割者</li>
						<li><img src="img/zszs.webp" width="282px"/><br><br>S车智慧之神</li>
					</ul>
				</div>
			<div id="myZ"></div>
			<div id="bb">
				<ul>
					<li>
						<img src="img/ctxz.png" width="288px"/><br><br>A车天行者
					</li>
					<li>
						<img src="img/yysb.png" width="280px"/><br><br>A车奔雷圣卫
					</li>
					<li><img src="img/ylhdc.webp" width="300px"/><br><br>A车鎏金玉魂
					</li>
					<li><img src="img/tyll.png" width="264px"/><br><br>A车时序使者</li>
				</ul>
			</div>
			<div id="ee"></div>
		</div>
		<div id="myG">
			<div id="cc">选手专属福利</div>
			<div><img src="img/xsfl.webp" width="1800px"/></div>
			<div id="dd">
				<ul>
					<h3>冠军</h3>
					<li>谁是车王S18冠军皇冠</li>
					<li>谁是车王S18冠军背景</li>
					<li>S18传奇车王挂饰</li>
					<li>S18传奇车王名片夹</li>
					<li>总决赛S车</li>
				</ul>
				<ul>
					<h3>亚军</h3>
					<li>谁是车王S18亚军皇冠</li>
					<li>谁是车王S18亚军背景</li>
					<li>S18传奇车王挂饰</li>
					<li>S18传奇车王名片夹</li>
					<li>总决赛S车</li>
				</ul>
				<ul>
					<h3>季军</h3>
					<li>谁是车王S18季军皇冠</li>
					<li>谁是车王S18季军背景</li>
					<li>S18传奇车王挂饰</li>
					<li>S18传奇车王名片夹</li>
					<li>总决赛S车</li>
				</ul>
				<ul>
					<h3>总决赛4—8名</h3>
					<li>谁是车王S18八强背景</li>
					<li>S18传奇车王挂饰</li>
					<li>S18传奇车王名片夹</li>
					<li>总决赛S车(1年)</li>
				</ul>
			</div>
		</div>
		<div id="myH">
			<div id="hh"><img src="img/s16.png" width="500px"/></div>
			<div id="ll">
				<p>《谁是车王》是《00飞车》顶级专业竞速类赛事，汇聚飞车界当下最为炙手可热的职业选手，<br />
				组成战队进行巅峰对抗。目前《谁是车王》专业的赛制赛程设置，顶级豪华的明星选手阵容，<br />
				吸引了无数的玩家的热烈关注，在短短时间内集聚了超级火爆<br />
				的人气，成为飞车玩家暑期不可或缺的场极速视听盛宴。</p><br /><br /><br />
				<p>11月29日，让我们共同见证S18车王诞生!</p>
			</div>
		</div>
	</div>
	<div id="secend_01">
			<div id="fhsfjsd">
				<div id="gf_1"><img src="img/logo4.webp" alt="" /></div>
				<div id="gf_2"><img src="img/logo3.webp" alt="" /></div>
				<div id="gf_3"><img src="img/logo2.webp" alt="" /></div>
				<div id="gf_4"><img src="img/gswj.webp" alt="" /></div>
				
				<ul class="wbsr">
					<li>腾讯互动娱乐|服务条款|隐私保护指引儿童隐私保护指引腾讯游戏招聘|腾讯游戏客服|游戏列表|广告服务及商务合作</li>
					<li>腾讯公司版权所有 网络游戏行业防沉迷自律公约</li>
					<li>COPYRIGHT ◎ 1998 -2024 TENCENT. ALL RIGHTS RESERVED.</li>
					<li>著作权人:腾讯科技(深圳)有限公司出版单位:深圳市腾讯计算机系统有限公司</li>
					<li>温馨提示:本游戏适合16岁(含)以上玩家娱乐;请您确定已如实进行实名注册;为了您的健康，请合理控制游戏时间。</li>
					<li>扺制不良游戏 拒绝盜版游戏 注意自我保护 谨防受骟上当 适度游戏益脑 沉游戏伤 合理安排时间 享受健康生活</li>
					<li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工商网监电子标识|粤网文[2023]2882-203号|(署)网出证(粤)字第054号</li>
				</ul>
			</div>
		</div>
		<div id="mym">
			<a href="#mop" target="_parent">
			<img src="img/fhdb.png" width="200px" height="200px" />
			</a>
		</div>
	</body>
</html>

二、成员子页面flxy

QQ赛车、服装皮肤、蜡笔小新及线下真人活动
在这里插入图片描述

CSS外部样式

<style>
			html,body{
				margin: 0;
				padding: 0;
				transition:all 0.5s linear;
				background-color: whitesmoke;
			}
			#top{
				width: 2565px;
				border: 1px white solid;
				text-align: center;
				margin: 0px auto;
				position: fixed;
				background-color: white;
				padding: 0px;
				z-index: 9999;
				top: 0px;
			}
			.fly{
				position: relative;
				top: -7px;
			}
			.myA{
				margin-left:17px;
			}
			#mid{
				margin-top:-550px;
				margin-left: 70px;
				filter: blur(10px);
				position: relative;
				z-index: 888;
			}
			#left{
				margin-top:-350px;
				margin-left: 140px;
				z-index: 999;
				position: relative;
				font-weight: 900;
			}
			#left-2{
				top: -23px;
				color: white;
				font-size:30px ;
				z-index: 999;
				position: relative;
			}
			#left-3{
				margin-top:0px;
				margin-left: 140px;
				z-index: 999;
				position: relative;
				color: white;
				font-weight: 500;
			}
			#right{
				color: black;
				font-family: "楷体";
				font-size: 30px;
				font-weight: 600;
				margin-top:-63px;
				margin-left: 95px;
				z-index: 999;
				position: relative;
				padding: 0;
			}
			#right:hover{
				color: coral;
			}
			.b{
				border-radius: 20px;
				z-index: 888;
				position: relative;
				opacity: 0.9;
			}
			#k1{
				background-color:white;
				width: 1300px;
				height: 460px;
				border: 1px white solid;
				margin-left: 437px;
				margin-top: 100px;
				color: black;
			}
			#tp{
				text-align: center;
				font-weight: 900;
				font-size: 35px;
			}
			.box{
				padding: 65px;
				float: left;
				margin-top: -95px;
			}
			.b1{
				color: red;
				font-weight: 800;
				font-size: 20px;
			}
			#k2{
				background-color: white;
				width: 1500px;
				margin-left: 351px;
			}
			#tt{
				color: black;
			}
			.bottom{
				font-family: "华文彩云";
				text-shadow: 4px 4px 6px black;
				color: black;
				font-size: 55px;
				position: relative;
				z-index: 999;
			}
			.big img:hover{
				transform: scale(1.2);
			}
			.slider {
			    position: relative;
			    width: 500px; 
			    height: 800px; 
			    overflow: hidden;
			  }
			  .slide {
			    position: absolute;
			    width: 100%;
			    height: 100%;
			    opacity: 0;
			    transition: opacity 1s ease-in-out;
			  }
			  .active {
			    opacity: 1;
			}
			#fLXY img{
				  width: 400px;
				  height: 220px;
				  margin-left: 50px;
				  margin-top: 40px;
			}
			#fLXY{
				  margin-left: 454px;
				  margin-top: -800px;
			}
			#fLXY img:hover{
				transform: scale(1.2);
			}
			#k3{
				background-color:white;
				width: 1300px;
				height: 416px;
				margin-left: 437px;
			}
			#ttt{
				color: black;
				text-align: center;
				font-weight: 800;
			}
			#k4{
				background-color:white;
				width: 1300px;
				height: 880px;
				margin-left: 437px;
			}
			.ph{
				float: left;
				padding: 15px;
				border: 1px gray solid;
			}
			.ph1{
				float: left;
				padding: 13px;
				margin-left: 158px;
				margin-top: 15px;
				border: 1px gray solid;
			}
			#op{
			margin-left: 382px;
			margin-top: 13px;
			}
			.money{
				color: white;
				text-align: center;
				font-weight: 800;
				font-size: 20px;
				background-color: red;
				width: 150px;
				margin: 0px auto;
			}
			
			.car{
				font-size: 30px;
				color: black;
				text-align: center;
				font-weight: 800;
				font-family: "楷体";
			}
			.car:hover{
				color: blue;
			}
			.bo{
				padding: 65px;
				float: left;
				margin-top: -84px;
				height: 225px;
			}
			.bo img:hover{
				transform: scale(1.4);
			}
			#mm{
				color: black;
				text-align: center;
			}
			#mm:hover{
				color: blue;
			}
			#myr{
				margin-left: 1703px;
				margin-top: -143px;
				z-index: 1;
			}
			.lkj{
				margin-left: -204px;
			}
			
			#secend_01 {
				width: 1364px;
				height: 300px;
				margin: 0px auto;
			}
			#fhsfjsd{
				width: 2390px;
				height: 331.33px;
				margin: 0px auto;
				position: absolute;
				top: 3917px;
				left: -138px;
				background-color:#e6e6e6;
			}
			#gf_1{
				position: absolute;
				top: 135px;
				left: 472px;
			}
			#gf_2{
				position: absolute;
				top: 128px;
				left: 942px;
			}
			#gf_3{
				position: absolute;
				top: 130px;
				left: 775px;
			}
			#gf_4{
				position: absolute;
				top: 266px;
				left: 1142px;
			}
			.wbsr{
				list-style: none;
				margin: 0px auto;
				position: absolute;
				top: 59px;
				left: 1100px;
				line-height: 33px;
				color: black;
			}
		</style>

html内部代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>QQ赛车、服装皮肤、蜡笔小新及线下真人活动</title>
		
	</head>
	<body>
		<h1 id="mop"></h1>
		<div id="top">
			<img class="lkj" a src="img/OIP-C.jfif" title="QQ speed"  
			width="30px" height="30px"/> <span class="fly">&nbsp;&nbsp;&nbsp;QQ飞车</span>
		</div>
		<div class="myA">
			<img src="img/tszvf5l05rp.webp" width="2565px"  height="1000px"/>
		</div>
		<div id="mid">
			<img src="img/168056899.jpg" width="800px" height="400px" />
		</div>
		<div id="left">
			<img src="img/OIP-C.jfif" width="70px" height="70px" /> <span id="left-2">&nbsp;&nbsp;QQ飞车</span>
		</div>
		<div id="left-3">
			<p>《QQ飞车》由端游原班人马倾情打造，采用最新的渲 <br />
		        染方式，为玩家带来耳目一新的视觉体验!玩法上传 <br />
		        承端游的操作手感，原汁原味还原各种中高端操作技<br />
		        巧，竟速赛、道具赛、排位赛、剧情模式等端游经典<br />
		        模式玩法悉数登场，等你挑战!指尖狂欢，极速漂移 <br />
		        尽在《QQ飞飞车》!</p>
				<p ><img class="b" src="img/bg.webp" 
				width="300px"  height="50px"/></p>
				<a href="../zhongzichao/K01zhongzichao.html" target="_blank"><p id="right">返回首页</p></a>
		<div id="k1">
			<div id="tp">
				<h4>精彩活动
				<hr /><hr /></h4>
			</div>
			<div class="box">
				<p><img src="img/20241222160704.jpg" width="300px" height="150px" /></p>
				<p class="b1">蜡笔小新趣萌幻形A车</p>
				<p>活动时间：2024-12-19~2025-01-01</p>
			</div>
			<div class="box">
				<p><img src="img/43907163217237.jpg"  width="300px" height="150px" /></p>
				<p class="b1">南瓜奇妙夜</p>
				<p>活动时间：2024-12-19~2025-02-09</p>
			</div>
			<div class="box">
				<p><img src="img/7827081994257.jpg"  width="300px" height="150px" /></p>
				<p class="b1">盛邀重返 必得永久</p>
				<p>活动时间：2024-11-05~2024-12-01</p>
			</div>
		</div>
		<div id="k3">
			<div id="ttt"><h1>炫酷车辆皮肤<hr /><hr /></h1></div>
			<div class="bo">
				<p><img src="img/car1.jpg" height="170px" width="300px" /></p>
				<p class="car">墨影青龙</p>
			</div>
			<div class="bo">
				<p><img src="img/car02.jpg" height="170px" width="300px" /></p>
				<p class="car">S－霆光</p>
			</div>
			<div class="bo">
				<p><img src="img/car03.jpg" height="170px" width="300px" /></p>
				<p class="car">云逍</p>
			</div>
			<div id="mm"><p>点击查看更多皮肤</p></div>
		</div>
		<div id="k4">
			<div id="ttt"><h1>冬日精美皮肤上线<hr /><hr /></h1></div>
			<div class="ph">
				<p><img src="img/1.gif" alt="" /></p>
				<p class="money">40.02Q币</p>
			</div>
			<div class="ph">
				<p><img src="img/2.gif" alt="" /></p>
				<p class="money">40.02Q币</p>
			</div>
			<div class="ph">
				<p><img src="img/3.gif" alt="" /></p>
				<p class="money">40.02Q币</p>
			</div>
			<div class="ph1">
				<p><img src="img/4.gif" alt="" /></p>
				<p class="money">40.02Q币</p>
			</div>
			<div class="ph1">
				<p><img src="img/5.gif" alt="" /></p>
				<p class="money">40.02Q币</p>
			</div>
		</div>
		<div id="op">
			<img src="img/QQ20250102-145220.png" alt="" />
		</div>
		<div id="k2">
			<div ><p class="bottom">线下真人活动cosplay₍ᐢ.ˬ.⑅ᐢ₎</p></div>
			<div class="slider">
				<img src="img/mn_20241223140034.jpg" class="slide active"/>
				<img src="img/mn_20241223140106.jpg" class="slide" />
				<img src="img/mn_20241223140123.jpg" class="slide" />
				<img src="img/mn_20241223140135.jpg" class="slide" />
				<img src="img/nb_20241223140053.jpg" class="slide" />
			</div>
			<script>
			  let currentSlide = 0;
			  const slides = document.querySelectorAll('.slide');
			  const totalSlides = slides.length;
			  
			  function showSlide(index) {
			    slides.forEach(slide => {
			      slide.classList.remove('active');
			    });
			    slides[index].classList.add('active');
			  }
			  
			  function nextSlide() {
			    currentSlide = (currentSlide + 1) % totalSlides;
			    showSlide(currentSlide);
			  }
			   setInterval(nextSlide, 2000); 
			  showSlide(currentSlide);
			</script>
			<div>
				
			</div>
			<div id="fLXY">
				<img src="img/111_20241223141309.jpg" alt="" />
				<img src="img/222_20241223141320.jpg" alt="" />
				<img src="img/333_20241223141332.jpg" alt="" />
				<img src="img/444_20241223141340.jpg" alt="" />
				<img src="img/5555_20241223141349.jpg"alt="" />
				<img src="img/666_20241223141958.jpg" alt="" />
			</div>
			
		</div>
		<div id="myr">
				<a href="#mop" target="_parent">
				<img src="img/fhdb.png" width="150px" height="150px" />
				</a>
			</div>
			<div id="secend_01">
					<div id="fhsfjsd">
						<div id="gf_1"><img src="img/logo4.webp" alt="" /></div>
						<div id="gf_2"><img src="img/logo3.webp" alt="" /></div>
						<div id="gf_3"><img src="img/logo2.webp" alt="" /></div>
						<div id="gf_4"><img src="img/gswj.webp" alt="" /></div>
						
						<ul class="wbsr">
							<li>腾讯互动娱乐|服务条款|隐私保护指引儿童隐私保护指引腾讯游戏招聘|腾讯游戏客服|游戏列表|广告服务及商务合作</li>
							<li>腾讯公司版权所有 网络游戏行业防沉迷自律公约</li>
							<li>COPYRIGHT ◎ 1998 -2024 TENCENT. ALL RIGHTS RESERVED.</li>
							<li>著作权人:腾讯科技(深圳)有限公司出版单位:深圳市腾讯计算机系统有限公司</li>
							<li>温馨提示:本游戏适合16岁(含)以上玩家娱乐;请您确定已如实进行实名注册;为了您的健康，请合理控制游戏时间。</li>
							<li>扺制不良游戏 拒绝盜版游戏 注意自我保护 谨防受骟上当 适度游戏益脑 沉游戏伤 合理安排时间 享受健康生活</li>
							<li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工商网监电子标识|粤网文[2023]2882-203号|(署)网出证(粤)字第054号</li>
						</ul>
					</div>
				</div>
		</body>		
	</body>
</html>

三、、成员子页面tyi

QQ飞车官方论坛

在这里插入图片描述

CSS外部样式

<style>
	body{
		background: url(img/ql2.jpg) no-repeat;
		
		height:1500px;
		
	}
	a{
		color:#333;
		float:left;
		padding:0px 4px;
		height:24px;
		line-height:24px;
	}
	a:hover{
		text-decoration:underline;
	}
	button{
		width:75px;
	}
	.p{
		float:right;
	}
	.pn{
		float:right;
		width:75px;
		margin-top:58px;
		position: relative;
		top: -11px;
		left: 153px;
	}
	.pn,em{
		line-height:21px;
		padding:-1px 4px;
	}
	.m{
		margin-top:45px;
		float:right;
		position: relative;
		left: 89px;
	}
	.s{
		margin-top:68px;
		float:right;
		position: relative;
		top: 10px;
		left: 161px;
	}
	#nv{
		width: 1325px;
		position: sticky;
		position: relative;
		right: -359px;
		height:33px;
		background:#2B7ACD;
		width: 1321px;
		
		
	}
	.e{
		float:right;
		color:#369;
		font-weight:700;
		position: relative;
		left: -19px;
		top: 4px;
		display:inline-block;
		height: 30px;
		width: 80px;
		background: url(img/qmenu.png) 88px 0px;
	}
	#myA{
		height: 200px;
	}
	#g{
		margin-top:46px;
		width:290px;
		height:73px;
		margin-top:-20px;
	}
	#f{
		width: 1325px;
		position: sticky;
		margin-top:-5px;
		margin-left: 877px;
		position: relative;
		left: -521px;
	}
	.k1{
		list-style:none;
		color:white;
		margin-left:-11px;
	}
	#nv .k1{
		float:left;
		padding:6px 12px;
	}
	.k1:hover{
		color:#FFF;
		background-color:#369;
		text-decoration:underline;
	}
	.h{
		width:95px;
		height:26px;
		float:right;
		margin-right:-67px;
		margin-top:2px;
	}
	#d{
		margin-top:-123px;
	}
	#h{
		float:right;
	}
	#myo{
		position: absolute;
		left: 2103px;
		top: 2108px;
		z-index: 1;
		background:url(img/chart.png) no-repeat 0 50%;
	}
	#myC{
		margin-top:-3px;
		margin:19px;
	}
	#ty{
		color:#999;
		margin: 0px auto;
		text-align: center;
		margin-left: -585px;
		padding: 0px;
	}
	#xs{
		color:#444;
		font-style:normal;
	}
	#fl{
		margin:0px 5px;
		color:#CCC;
	}
	#c1{
		background-color:#F2F2F2;
		border:1px #C2D5E3 solid;
		margin-top:-53px;
		line-height:31px;
		height:46px;
		width: 1321px;
		margin-left: 360px;
	}
	#c2{
		font-size:16px;
		margin-top:3px;
		margin-left: 7px;
	}
	#c3{
		background-color:#F2F2F2;
		border:1px #C2D5E3 solid;
		border-right:#F2F2F2;
		margin-top:-2px;
		height:277px;
		width:607px;
		float:left;
		
	}
	.g1{
		color:#369;
		margin-top:-8px;
		margin-left:-3px;
	}
	#c4{
		background-color:#F2F2F2;
		border:1px #C2D5E3 solid;
		height:277px;
		width:1294px;
		margin: 0px auto;
		margin-left: 362px;
	}
	.g2{
		margin-top:36px;
		margin-left:7px;
	}
	#c5{
		margin-top:-4px;
		margin-left:7px;
		color:#369;
	}
	#c5:hover{
		text-decoration:underline;
	}
	#a1{
		margin-top:-7px;
		margin-left:10px;
	}
	#a2{
		margin-top:-215px;
		margin-left:635px;
	}
	#a3{
		float:right;
		background-color:#F2F2F2;
		border:1px #C2D5E3 solid;
		width:646px;
		height:277px;
		border-left:#F2F2F2;
		margin-top: -2px;
		margin-right: -25px;
	}
	.c6{
		color:#369;
		background-color:#F2F2F2;
		margin-left: -19px;
		
	}
	.c6:hover{
		text-decoration:underline;
	}
	#a5{
		line-height:27px;
	}
	#t1{
		border:1px #C2D5E3 solid;
		background-color:#F2F2F2;
		color:#2B7ACD;
		height:30px;
		margin-top:15px;
		width:1325px;
		margin: 6px auto;
		margin-left: 360px;
	}
	#t2{
		font-size:20px;
		margin-top:4px;
		
	}
	#t3{
		border:1px #C2D5E3 solid;
		background-color:#F2F2F2;
		height:250px;
		width:1325px;
		margin-left: 360px;
	}
	#t4{
		border:1px #F2F2F2 solid;
		height:110px;
		width:385px;
	}
	.f1{
		margin-top:-108px;
		margin-left:118px;
		font-weight:700;
	}
	#a6{
		margin-top:-6px;
		margin-left:118px;
	}
	#a7{
		margin-top:-4px;
		margin-left:118px;
	}
	#a7:hover{
		text-decoration:underline;
		color:#333;
	}
	.f1:hover{
		text-decoration:underline;
		color:#333;
	}
	#t5{
		border:1px #F2F2F2 solid;
		height:110px;
		width:385px;
		margin-left:385px;
		margin-top:-112px;
	}
	#t6{
		border:1px #F2F2F2 solid;
		height:110px;
		width:385px;
		margin-top:-112px;
		margin-left: 772px;
	}
	.f2{
		margin-top:7px;
		margin-left:12px;
	}
	#t7{
		border:1px #F2F2F2 solid;
		height:110px;
		width:385px;
		margin-top:11px;
		margin-left:0px;
	}
	.f3{
		margin-top:-110px;
		margin-left:116px;
		font-weight:700;
	}
	.f3:hover{
		text-decoration:underline;
		color:#333;
	}
	#a8{
		margin-top: -7px;
		margin-left:116px;
	}
	#a9{
		margin-top:-3px;
		margin-left:114px;
	}
	#a9:hover{
		text-decoration:underline;
		color:#333;
	}
	#t8{
		border:1px #F2F2F2 solid;
		 height:110px;
		 width:385px;
		 margin-top:-112px;
		 margin-left:386px;
	}
	#nr{
		position: fixed;
		width: 1382px;
		height: 81px;
		top: 0px;
		background: #2B7ACD;
		z-index: 1;
		margin-left: 330px;
		
	}
	.tt1{
		float: left;
		width: 230px;
		line-height: 50px;
		font-size: 22px;
		text-align: center;
		list-style-type: none;
		top: 0px;
		
	}
	.tt1 a{
		color:#fff;
		display: block;
		text-decoration: none;
		margin-top: -15px;
		  
	}
	.tt1 .bj:hover{
		background-color: aqua;
		
	}
	.tt2{
		list-style-type: none;
		width: 130px;
		background: #2B7ACD;
		box-shadow: rgba(0, 0, 0, .6);
		display: none;
		
		
	}
	.tt1:hover .tt2{
		display: block;
		
	}
	.jb:hover{
		color: aqua;
	}
	.jb{
		margin-left: -40px;
		line-height: 60px;
		font-size: 17px;
	}
	#myp{
		width: 900px;
		height: 1000px;
		border: 1px black solid;
		margin: 0px auto;
		margin-left: 39px;
	}
	.gjt{
		list-style: none;
	}
	.yuri{
		list-style: none;
	}
	.yuri video:hover{
		transform: scale(1.5);
	}
	.myl{
		float: left;
		padding: 0px;
	}
	#parent{
		width: 2000px;
		height: 2000px;
		margin: 0px auto;
	}
	#bj{
		width: 900px;
		height: 1000px;
		border: 1px black solid;
		margin: 0px auto;
		margin-right: 25px;
		margin-top: -1005px;
	}
	.tyu{
		list-style: none;
		font-size: 22px;
	}
	.tyu_2{
		list-style: none;
	}
	.tyu_2 img:hover{
		transform: scale(1.8);
	}
	.tyu_3{
		float: left;
		padding: 11px;
	}
	
	#secend_01 {
		width: 1364px;
		height: 300px;
		margin: 0px auto;
	}
	#fhsfjsd{
		width: 2390px;
		height: 331.33px;
		margin: 0px auto;
		position: absolute;
		top: 1980px;
		left: 0px;
		background-color:#e6e6e6;
	}
	#gf_1{
		position: absolute;
		top: 135px;
		left: 472px;
	}
	#gf_2{
		position: absolute;
		top: 128px;
		left: 942px;
	}
	#gf_3{
		position: absolute;
		top: 130px;
		left: 775px;
	}
	#gf_4{
		position: absolute;
		top: 266px;
		left: 1142px;
	}
	.wbsr{
		list-style: none;
		margin: 0px auto;
		position: absolute;
		top: 59px;
		left: 1100px;
		line-height: 33px;
	}
</style>

html内部代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>官方论坛</title>

	</head>
	<body>
		<div id="parent">
			<h1 id="mop"></h1>
			<div id="hrc">
			        </div>
			        <div id="eqiwfh"">
			        <div id="nr">
			            <ul class="tt"></ul>
			                <li class="tt1">游戏资料
			                <ul class="tt2">
			                    <li>新手指引</li>
			                    <li>官方遏画</li>
			                    <li>高清壁纸</li>
			                    <li>游戏下载</li>
			                    <li>飞车手游</li>
			                </ul>
			                </li>
			                <ul class="tt"></ul>
			                    <li class="tt1">赛事中心
			                <ul class="tt2">
			                    <li>谁是车王</li>
			                    <li>SSC</li>
			                    <li>全国公开赛</li>
			                </ul>
			                </li>
			            <ul class="tt"></ul>
			                <li class="tt1">活动中心
			                <ul class="tt2">
			                    <li>版本专区四</li>
			                    <li>合作区</li>
			                    <li>福利记兑换&cdk兑换</li>
			                </ul>
			                </li>
			                <ul class="tt"></ul>
			                    <li class="tt1">更多
			                    <ul class="tt2">
			                        <li>戴钻专区</li>
			                        <li>道聚城</li>
			                        <li>点劵充值</li>
			                    </ul>
			                    </li>
			            <ul class="tt"></ul>
			                <li class="tt1">商城专区
			                <ul class="tt2">
			                        <li>教学视频</li>
			                        <li>视频中心</li>
			                    </ul>
			                    </li>
			                    <ul class="tt"></ul>
			                        <li class="tt1">视频直播
			                        <ul class="tt2">
			                            <li>官方论坛</li>
			                            <li>官方微信</li>
			                            <li>官方微博</li>
			                        </ul>    
			                </div>
						<div>
				<a class="z">设为首页</a>&nbsp;&nbsp;<a class="z">收藏本站</a><a class="p">切换到窄版</a>
				<a class="m">注册新账户</a><a class="s">忘记密码</a>
				<button type="submit" class="pn">
					<a href="../zhongzichao/K05.html" target="_blank"><em>登录</em></a>
				</button>
				<div>
					<h2>
						<p id="g"><img src="img/0.png"/></p>
					</h2>
				</div>
				<div id="nv">
					<a class="e">快捷导航</a>
					<!-- <p class="h"><img src="img/qmenu.png"/></p> -->
					<ul>
						<li class="k1">论坛首页</li><a href="../zhongzichao/K01zhongzichao.html" target="_blank"><li class="k1">官网首页</li></a>
						<li class="k1">心悦专区</li><li class="k1">客服入口</li>
					</ul>
				</div>
				<div id="f">
					<img src="img/b.jfif" width="1325px" height="150px"/>
				</div>
				<div id="myE">
					<div id="myC">
						<p id="ty">
						今日:
						<em id="xs">0</em>
						<span id="fl">|</span>
						昨日:
						<em id="xs">8</em>
						<span id="fl">|</span>
						帖子:
						<em id="xs">8018411</em>
						<span id="fl">|</span>
						会员:
						<em id="xs">4300263</em>
						<span id="fl">|</span>
					</div>
					</p>
				</div>
				<div id="c1">
					<h2 id="c2">论坛首页热点</h2>
				</div>
				<div id="c4">
					<div id="c3">
						<p><a class="g1">【赛道之王】炮总 极速航天城 1.13.99（A）</a></p>
						<p class="g2">
					    视频链接:https://v.qq.com/x/page/h3573lz5f12.html 
						QQ号:1250578878 借号QQ：1910564121 游戏名:炮总 游戏大区:电信区 
						赛道名称:极速航天城 完成时间:1.13.99 使用赛车:大耳狗雷诺...
						</p>
						<p id="c5">能不能改一下关闭大喷特效</p>
						<p id="a1">
							有个别的车大喷特效，确实挡视线，但是有的大喷也确实漂亮，
							建议更改一下关闭大喷特效这个功能，改为能单独开关某一辆车的大喷特效。
							这样不用频繁开关，只要选择想要关闭的那辆赛车即可。 还有，每次反馈都让加置顶...
						</p>
						<p id="a2"><img src="img/vline.png" height="260px"/></p>
					</div>
					<div id="a3">
						<ul id="a5">
							<li class="c6">
								官方出个圣诞元素的S车吧或是灵鹿雪橇出个道具
							</li>
							<li class="c6">
							    17周年
							</li>
							<li class="c6">
								17周年
							</li>
							<li class="c6">
								车神重归季
							</li>
							<li class="c6">
								白虎皮肤
							</li>
							<li class="c6">
								关于近期【免费活动】奖励的一点建议
							</li>
							<li class="c6">
								漂移系数和摩擦系数，分别具体指赛车什么性能？
							</li>
						</ul>
					</div>
				</div>
				<div id="t1">
					<h2 id="t2">版聊区</h2>
				</div>
				<div id="t3">
					<div id="t4">
						<p class="f2"><img src="img/fgj.jfif" width="95px" height="95px"/></p>
						<p class="f1">综合交流区</p>
						<p id="a6">主题:55万，帖数:702万</p>
						<p id="a7">最后发表:前天 09:36</p>
					</div>
					<div id="t5">
						<p class="f2"><img src="img/hjk.jfif" width="95px" height="95px"/></p>
						<p class="f1">问题提交区</p>
						<p id="a6">主题: 12万, 帖数: 54万</p>
						<p id="a7">最后发表: 昨天 22:34</p>
					</div>
					<div id="t6">
						<p class="f2"><img src="img/fug.jfif" width="95px" height="95px"/></p>
						<p class="f1">体验服讨论区</p>
						<p id="a6">主题: 4万, 帖数: 18万</p>
						<p id="a7">最后发表: 昨天 17:37</p>
					</div>
					<hr/>
					<div id="t7">
						<p class="f2"><img src="img/jft.jfif" width="95px" width="95px"/></p>
						<p class="f3">赛事交流区</p>
						<p id="a8">主题: 1万, 帖数: 15万</p>
						<p id="a9">最后发表: 2024-11-30 02:04</p>
					</div>
					<div id="t8">
						<p class="f2"><img src="img/hsy.jfif" width="95px" width="95px"/></p>
						<p class="f3">视频交流区</p>
						<p id="a8">主题: 1万, 帖数: 10万</p>
						<p id="a9">最后发表: 4 天前</p>
					</div>
				</div>
				
				<div id="myp">
					<ul class="gjt">
						<img src="img/tuyi.png" alt="" />
						<li>小橘子翻了翻日历，不知不觉就到了年底，快要和2024年说拜拜啦~这不，商城还上新了众多道具，一起来看！</li>
						<li>⭐️超值活动</li>
						<li> 1️⃣七日福利:攒碎片必得永久A车</li>
						<li> 2️⃣系统活动:折扣+宠物花木兰开启强化</li>
						<li> 3️⃣T3机甲:4辆T3机甲道具限时8折</li>
						<li> 4️⃣商城特卖:点券精选美衣返场</li>
						<li> 5️⃣精选折扣宝箱:限时折扣+返场</li>
						<li> 6️⃣传奇系列赛车皮肤:限时返场，低至1折起</li>
						<li>⭐️人气极品返场</li>
						<li> 1️⃣雷诺能源:S车皮肤雷诺之力-龙城飞将返场</li>
						<li> 2️⃣三国秘宝:S车皮肤终极爆天甲-刘备回归</li>
						<li> 3️⃣皮肤券:诸神之战系列赛车皮肤返场</li>
						<li> 4️⃣小麦收割机:SSC超级联赛系列A车返场</li>
						<li> 5️⃣可湿水纸巾:珍宝阁冰雪传奇系列返场</li>
						<li> 6️⃣发光圣诞树:开启必得任意美衣</li>
						<li>⭐️12.24全天5折</li>
						<li> 1️⃣圣诞雪景瓶:宠物花木兰返场</li>
						<li> 2️⃣家务机器人:人气经典美衣返场</li>
						<li>3️⃣自动洗碗机:精选美衣返场</li>
						<li>⭐️活动详情：没看错，七日福利得永久A车+美衣！S车雷诺之力&皮肤返场~</li>
						<li>福利多多，精彩不容错过，快来飞车大陆和好友一起度过美好时刻吧[哇][哇]～#QQ飞车#收起</li>
					</ul>
					<ul class="yuri">
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/0ozugbCSlx08kAG8nqnm010412000Aok0E010.mp4" />
							</video>
						</li>
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/2ppezcdalx08kAG8f3lu010412001iLp0E010.mp4" />
							</video>
						</li>
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/4CIf7dDFlx08kAG8fcs0010412001Qs70E010.mp4" />
							</video>
						</li>
						<li>
							<video autoplay controls width="200px" height="200px">
								<source src="video/JSLGZVvRlx08kAG87jB6010412000qN50E010.mp4" />
							</video>
						</li>
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/ObwRfKFTlx08kAG8jrlC010412000wt00E010.mp4" />
							</video>
						</li>
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/eJ7b7mAVlx08kAG8eJjy010412001W4W0E010.mp4" />
							</video>
						</li>
						<li class="myl">
							<video autoplay controls width="200px" height="200px">
								<source src="video/fC6y2F9flx08kAG8h2ow010412000KuE0E010.mp4" />
							</video>
						</li>
					</ul>
				</div>
				
				<div id="bj">
					<ul class="tyu">
						<img src="img/tuyi.png" />
						<li>QQ飞车超话 今日飞车大陆迎来了新成员，[送花花]四象少女-青龙闪亮登场！青龙破晓而至，打开胜利的曙光。接下来，[好爱哦]就跟随小橘子的步伐，领略青龙的威风吧～</li>
						<li>⭐赛车名称：X次元-青龙</li>
						<li>⭐赛车等级：S</li>
						<li>⭐喷口数量：9</li>
						<li>⭐宝石槽数：5</li>
						<li>⭐赛车描述：少女身姿矫健，绿光打破次元，化身机甲形态降世，通绿的机体上是特制的护甲，青龙神力赋予它生命的动感。</li>
						<li>⭐获取途径：12月15日-12月31日，使用【X次元原石】参加活动【X次元计划】即有机会获得首发</li>
						<li>【X次元】机娘赛车皮肤【X次元-青龙】[给力]以及其他极品奖励～</li>
						<li>⭐详情戳：今日已上线！首发机娘赛车皮肤X次元-青龙设计细节曝光！</li>
						<li>以上就是本次X次元-青龙的细节展示啦！青龙少女是不是十分呆萌可爱呢~心动不如行动，[爱你]赛车手们快快把她收入囊中吧～</li>
					    小橘子的朋友圈又双叒叕扩大啦！欢迎我们的新朋友——蜡笔小新
					    <li> QQ飞车×蜡笔小新联动将在2025年1月18日正式开启！</li>
					    <li>可爱的小新将会和小伙伴们在飞车大陆展开一场漂移大作战，</li>
					    <li>同时还会有超丰富的联动资源等着大家，让我们与小新相约春日部幼稚园，</li>
					    <li>一起开启这场奇妙之旅吧~</li>
					</ul>
					<ul class="tyu_2">
						<li class="tyu_3">
							<img src="img/ql1.jpg" width="150px" height="100px"/>
						</li>
						<li class="tyu_3">
							<img src="img/ql2.jpg" width="150px" height="150px"/>
						</li>
						<li class="tyu_3">
							<img src="img/ql3.jpg" width="150px" height="100px" />
						</li>
						<li class="tyu_3">
							<img src="img/ql4.jpg" width="150px" height="100px" />
						</li>
						<li class="tyu_3">
							<img src="img/ql5.jpg" width="150px" height="100px" />
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div id="secend_01">
				<div id="fhsfjsd">
					<div id="gf_1"><img src="img/logo4.webp" alt="" /></div>
					<div id="gf_2"><img src="img/logo3.webp" alt="" /></div>
					<div id="gf_3"><img src="img/logo2.webp" alt="" /></div>
					<div id="gf_4"><img src="img/gswj.webp" alt="" /></div>
					
					<ul class="wbsr">
						<li>腾讯互动娱乐|服务条款|隐私保护指引儿童隐私保护指引腾讯游戏招聘|腾讯游戏客服|游戏列表|广告服务及商务合作</li>
						<li>腾讯公司版权所有 网络游戏行业防沉迷自律公约</li>
						<li>COPYRIGHT ◎ 1998 -2024 TENCENT. ALL RIGHTS RESERVED.</li>
						<li>著作权人:腾讯科技(深圳)有限公司出版单位:深圳市腾讯计算机系统有限公司</li>
						<li>温馨提示:本游戏适合16岁(含)以上玩家娱乐;请您确定已如实进行实名注册;为了您的健康，请合理控制游戏时间。</li>
						<li>扺制不良游戏 拒绝盜版游戏 注意自我保护 谨防受骟上当 适度游戏益脑 沉游戏伤 合理安排时间 享受健康生活</li>
						<li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工商网监电子标识|粤网文[2023]2882-203号|(署)网出证(粤)字第054号</li>
					</ul>
				</div>
			</div>
			<div id="myo">
				<a href="#mop" target="_parent">
				<img src="img/fhdb.png" width="200px" height="200px" />
				</a>
			</div>
	</body>
</html>