HTML静态网页成品作业(HTML+CSS+JS)——游戏天天酷跑网页(4个页面)

🎉不定期分享源码,关注不丢失哦

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • HTML部分代码
  • 五、源码获取


一、作品介绍

🏷️本套采用HTML+CSS,使用Javacsript代码实现图片切换轮播,共有4个页面

二、作品演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="nav"><a href="index.html" class="on">首页</a><a href="zuoqi.html">推荐坐骑</a><a href="renwu.html">推荐人物</a><a href="chongwu.html">推荐宠物</a></div><div class="banner"><div id="banner_img_box"><img id="banner_img" src="./images/1.jpg"></div></div><script>function change(index){var banner_img = document.getElementById('banner_img');banner_img.src = './images/'+index+'.jpg';}var index = 2;setInterval(function(){if(index > 3) {index = 1;}change(index);index += 1;},3000);</script><div class="content"><div class="tuijian"><a class="tuijian_item" href="zuoqi.html"><div class="tuijian_item_img"><img src="./images/6.jpg" alt=""></div><span>推荐坐骑</span></a><a class="tuijian_item" href="renwu.html"><div class="tuijian_item_img"><img src="./images/12.jpg" alt=""></div><span>推荐人物</span></a><a class="tuijian_item" href="chongwu.html"><div class="tuijian_item_img"><img src="./images/18.jpg" alt=""></div><span>推荐宠物</span></a></div><div class="title">推荐搭配</div><div class="dapei"><div class="dapai_item"><div class="dapai_item_img"><img src="./images/23.jpg" alt=""></div><span>这一定是酷跑史上最经典的搭配,是的,最经典没有之一。超奖触发萝卜,再大圣归来3.0倍得分,直接逆天,在当时,这搭配几乎人手一套。</span></div><div class="dapai_item"><div class="dapai_item_img"><img src="./images/24.jpg" alt=""></div><span>什么也不用说了,或许我们00后并不稀罕这套搭配,但是你可以问问一些8090后,他们绝对放不下这套。闪电豹作为超奖内自动巨化,配上全程金币化的金枪小帅,啥也不用说了,放在酷跑初期就是一个YYDS。</span></div><div class="dapai_item"><div class="dapai_item_img"><img src="./images/25.jpg" alt=""></div><span>在我的印象里,官方很少推荐搭配,但是这一套是官方少有的推荐之一,尽管后面出现了更强势的熊猫宗师,而且这一套人气确实不高,但他是我退游前最喜欢的一套,当时觉得自己很强,我很喜欢我的帽子先生。</span></div><div class="dapai_item"><div class="dapai_item_img"><img src="./images/26.jpg" alt=""></div><span>多次提到小肥羊,猫小魅的技能是慢速冲刺并吸收星星,看上去貌似与小肥羊冲突,但是这两者搭配却有奇效,别的不说,只要宝物配上,放现在依旧能打,我半年前就用这套+美神瑶姬+莴苣姑鸟,分米比居然能达到惊人的13000:1</span></div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1451961.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

七、IP路由原理和路由引入

目录 一、IP路由原理 二、路由引入 2.1、双点双向路由引入 2.2、路由回灌 三、路由策略与路由控制 路由匹配工具&#xff08;规则&#xff09; ACL IP前缀列表 路由控制工具&#xff08;控制&#xff09; 策略工具1 策略工具2 搭配组合 组…

基于SSM+Jsp的在线教育资源管理系统

开发语言&#xff1a;Java框架&#xff1a;ssm技术&#xff1a;JSPJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包…

【Java并发编程之美 | 第一篇】并发编程线程基础

文章目录 1.并发编程线程基础1.1什么是线程和进程&#xff1f;1.2线程创建与运行1.2.1继承Thread类1.2.2实现Runnable接口1.2.3实现Callable接口&#xff08;与线程池搭配使用&#xff09;1.2.4小结 1.3线程常用方法1.3.1线程等待与通知1.3.2线程睡眠1.3.3让出CPU执行权1.3.4线…

CATO原理中的数学与魔术(十三)——综合应用

早点关注我&#xff0c;精彩不错过&#xff01; 不知不觉&#xff0c;这个系列已经写了48篇文章&#xff0c;4篇数学理论介绍和3个系列共8篇魔术应用&#xff0c;相关内容请戳&#xff1a; CATO原理中的数学与魔术&#xff08;十二&#xff09;——CATO与MAT principle CATO原理…

[C#]使用C#部署yolov10的目标检测tensorrt模型

【测试通过环境】 win10 x64vs2019 cuda11.7cudnn8.8.0 TensorRT-8.6.1.6 opencvsharp4.9.0 .NET Framework4.7.2 NVIDIA GeForce RTX 2070 Super cuda和tensorrt版本和上述环境版本不一样的需要重新编译TensorRtExtern.dll&#xff0c;TensorRtExtern源码地址&#xff1a;T…

气膜球幕影院:科技创新的结晶—轻空间

气膜球幕影院集成了多项先进科技&#xff0c;打造出一种全新的沉浸式观影体验。让我们一起来了解这些科技创新背后的故事。 高分辨率投影技术 气膜球幕影院采用先进的高分辨率投影技术&#xff0c;通常支持4K甚至8K的超高清画质&#xff0c;保证了影像的细腻和逼真。无论是科幻…

LabVIEW软件开发任务的工作量估算方法

在开发LabVIEW软件时&#xff0c;如何准确估算软件开发任务的工作量。通过需求分析、功能分解、复杂度评估和资源配置等步骤&#xff0c;结合常见的估算方法&#xff0c;如专家判断法、类比估算法和参数估算法&#xff0c;确保项目按时按质完成&#xff0c;提供项目管理和资源分…

十大成长型思维:定位思维、商业思维、时间管理思维、学习成长思维、精力管理思维、逻辑表达思维、聚焦思维、金字塔原理、目标思维、反思思维

一、定位思维 定位思维是一种在商业和管理领域中至关重要的思维模式&#xff0c;它涉及到如何在顾客心智中确立品牌的独特位置&#xff0c;并使其与竞争对手区分开来。以下是关于定位思维的清晰介绍&#xff1a; 1、定义 定位思维是一种从潜在顾客的心理认知出发&#xff0c;通…

自动生成企业培训视频:创新与效率的完美结合

前言 随着人工智能技术的飞速发展&#xff0c;大模型技术在各个领域的应用日益广泛。在企业培训领域&#xff0c;大模型技术的应用为培训视频的生成带来了革命性的变革。本文将探讨如何利用大模型技术自动生成企业培训视频&#xff0c;以及这一技术为企业培训带来的创新和效率…

Unity OpenCVForUnity 安装和第一个案例详解 <一>

目录 一、资源简介 二、安装使用 1.下载案例Demo 2.移动StreamingAssets文件夹 3.添加场景 三、今日案例 1.案例Texture2DToMat Example 2.什么是Mat&#xff1f; 3.如何把Texture2D变成Mat &#xff08;1&#xff09;.初始化Mat &#xff08;2&#xff09;.Cv_…

门控循环单元GRU与长短期记忆网络LSTM

门控循环单元与长短期记忆网络 门控隐状态 问题提出&#xff1a;对于一个序列来说不是每个观察值都是同等重要想只记住相关的观察需要&#xff1a; 能关注的机制&#xff08;更新门&#xff09;能遗忘的机制&#xff08;重置门&#xff09; 第一个词元的影响至关重要。 我们…

变压器绕组内部故障的Simulink仿真

​利用变压器纵联差动保护的Simulink仿真模型是无法进行变压器绕组内部故障仿真的。为了解决这一问题&#xff0c;可将图中的三相变压器模型改变为三个单相变压器 , 在变压器属性框中选中 “三绕组变压器” (Three windings Transformer), 从而构造出一个一次绕组, 两个二次绕组…

MySQL之优化服务器设置(二)

优化服务器设置 InnoDB事务日志(包含:Redo log 重做日志和Undo log回滚日志) 了解清楚"把日志缓冲写到日中文件"和"把日志刷新到持久化存储"之间的不同是很重要的。在大部分操作系统中&#xff0c;把缓冲写到日志只是简单地把数据从InnoDB的内存缓冲转移…

高考志愿填报,大学读什么专业比较好?

高考分数出炉后&#xff0c;选择什么样的专业&#xff0c;如何去选择专业&#xff1f;于毕业生而言是一个难题。因为&#xff0c;就读的专业前景不好&#xff0c;意味着就业情况不乐观&#xff0c;意味着毕业就是失业。 盲目选择专业的确会让自己就业时受挫&#xff0c;也因此…

【第7章】Vue之第一个Vue程序(Vue创建)

文章目录 前言一、创建1. 命令行2. 创建3. 安装依赖 二、启动三、访问总结 前言 接下来我们通过VSCode来创建我们的第一个Vue应用程序。 一、创建 1. 命令行 Terminal>New Terminal 2. 创建 #这一指令将会安装并执行 create-vue&#xff0c;它是 Vue 官方的项目脚手架工…

【Quartus 13.0】EP1C3144I7 部署4*6矩阵键盘

仿照 正点原子 的 Sample 修改 V2手册 P266 没有用这个 给出的手动按键控制的矩阵模块 为 4*6 矩阵键盘外接模块 每一个按键自带led&#xff0c;所以对应的接口是合并在一起的一个引脚 按下后 LED 亮&#xff0c;vice versa 底部 LED*8 目前不清楚有什么用 或许可以变成 16进…

人工智能在风险管理中的创新之路

随着科技的飞速发展&#xff0c;人工智能&#xff08;AI&#xff09;已经渗透到我们生活的方方面面&#xff0c;尤其在风险管理领域&#xff0c;其展现出的巨大潜力令人瞩目。风险管理&#xff0c;作为一个涉及广泛领域的复杂系统&#xff0c;正逐渐依赖于AI技术来提升效率和准…

Folx软件下载及安装教程

简介&#xff1a; Folx Pro是一款适合Mac的专业下载工具也是一款BT下载器&#xff0c;Folx中文版有一个支持Retina显示的现代界面&#xff0c;提供独特的系统排序、存储下载内容与预览下载文件。Folx中文官网提供Folx教程、激活码、下载。 安 装 包 获 取 地 址&#xff1a; …

漫谈中国历史:《米小圈漫画历史》带大家领略古今变迁

在漫画的世界里&#xff0c;历史可以是生动有趣的&#xff0c;就像《米小圈漫画历史》展现的那样。这一套以米小圈形象为主的原创幽默中国历史漫画书&#xff0c;不仅让读者在娱乐中学习&#xff0c;更是一次穿越历史长河的奇妙冒险。在这篇文章中&#xff0c;我们将跟随米小圈…

(游戏:挑一张牌)编写程序,模拟从一副 52 张的牌中选择一张牌。

(游戏:挑一张牌)编写程序&#xff0c;模拟从一副 52 张的牌中选择一张牌。程序应该显示牌的 大小(Ace、2、3、4、5、6、7、8、9、10、Jack、Queen、King)以及牌的花色(Clubs (黑梅花)、Diamonds(红方块)、Hearts(红心)、Spades(黑桃))。下面是这个程序的 运行示例: The card yo…