首页 前端知识 80个HTML5 js小游戏集合

80个HTML5 js小游戏集合

2024-11-02 10:11:10 前端知识 前端哥 462 488 我要收藏

代码列表:

一个都不能死,捕鱼达人,3D魔方,蜘蛛纸牌,双人五子棋,罗盘时钟,黑客模拟器。。。。。。

有点多直接上图

代码:

<!DOCTYPE HTML>
<html>
<head>
   <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="../css/sptx.css">
        <section class="main">
                <div class="box">
<a target="right" href="../yxmb/2/index.html">
<div class="item"><div class="logo">
<img src="../images/y2.png" alt=" Coding"> 一个都不能死</div>
<div class="desc">分为4个模式,看看你的反应能力和手速怎么样吧</div></div></a>

<div><a target="right" href="../yxmb/3/index.html">
<div class="item"><div class="logo">
<img src="../images/y3.png" alt=" Coding"> 捕鱼达人</div>
<div class="desc">一共有七档,界面还原,赶快试试吧</div></div></a>

<div><a target="right" href="../yxmb/4/index.html">
<div class="item"><div class="logo">
<img src="../images/y4.png" alt=" Coding"> 植物大战僵尸</div>
<div class="desc">经典游戏还原,有两种模式选择</div></div></a>

<div><a target="right" href="../yxmb/5/index.html">
<div class="item"><div class="logo">
<img src="../images/y5.png" alt=" Coding"> 3D魔方</div>
<div class="desc">鼠标点击操作,三阶魔方形状通常是正方体</div></div></a>

<div><a target="right" href="../yxmb/6/index.html">
<div class="item"><div class="logo">
<img src="../images/y6.png" alt=" Coding"> 青蛙吃苍蝇</div>
<div class="desc">兼容PC端和移动端,背景音乐开关功能,白天晚上两种背景</div></div></a>

<div><a target="right" href="../yxmb/7/index.html">
<div class="item"><div class="logo">
<img src="../images/y7.png" alt=" Coding"> 蜘蛛纸牌</div>
<div class="desc">游戏的目标以最少的移动次数将牌面中的十叠牌及待发的五组</div></div></a>

<div><a target="right" href="../yxmb/8/index.html">
<div class="item"><div class="logo">
<img src="../images/y8.png" alt=" Coding"> 贪吃蛇</div>
<div class="desc">贪吃蛇游戏是一款经典的益智游戏</div></div></a>

<div><a target="right" href="../yxmb/9/index.html">
<div class="item"><div class="logo">
<img src="../images/y9.png" alt=" Coding"> 水果消除</div>
<div class="desc">jQuery水果消除基于jquery.1.10.2.min.js制作(小星美化)</div></div></a>

<div><a target="right" href="../yxmb/10/index.html">
<div class="item"><div class="logo">
<img src="../images/y10.png" alt=" Coding"> 2048中文版</div>
<div class="desc">2048中文版小游戏基于jquery.1.10.2.min.js制作</div></div></a>
<a target="right" href="../yxmb/12/index.html">
<div class="item"><div class="logo">
<img src="../images/y12.png" alt=" Coding"> 飞机大战</div>
<div class="desc">JS飞机大战网页版小游戏,鼠标控制战机攻击敌人</div></div></a>

<div><a target="right" href="../yxmb/13/index.html">
<div class="item"><div class="logo">
<img src="../images/y13.png" alt=" Coding"> 跑酷小游戏</div>
<div class="desc">HTML5跑酷小游戏,按键盘空格键跳跃</div></div></a>

<div><a target="right" href="../yxmb/14/index.html">
<div class="item"><div class="logo">
<img src="../images/y14.png" alt=" Coding"> 贪吃蛇2.0</div>
<div class="desc">JS网页版贪吃蛇小游戏,原生JS</div></div></a>

<div>

<div><a target="right" href="../yxmb/16/index.html">
<div class="item"><div class="logo">
<img src="../images/y16.png" alt=" Coding"> 激流勇进</div>
<div class="desc">HTML5 canvas激流勇进小游戏代码,迷宫逃生小游戏</div></div></a>

<div><a target="right" href="../yxmb/17/index.html">
<div class="item"><div class="logo">
<img src="../images/y17.png" alt=" Coding"> 天天消消乐</div>
<div class="desc">让三个及以上的同色小动物横竖相连即可消除</div></div></a>

<div><a target="right" href="../yxmb/18/index.html">
<div class="item"><div class="logo">
<img src="../images/y18.png" alt=" Coding"> 别踩白块</div>
<div class="desc">只要不是白块,一个个点吧,游戏速度随着时间增加而加快</div></div></a>

<div><a target="right" href="../yxmb/19/index.html">
<div class="item"><div class="logo">
<img src="../images/y19.png" alt=" Coding"> 线条生存</div>
<div class="desc">线条生存躲避游戏,移动鼠标,拖动线条,躲避白点,获得积分</div></div></a>

<div><a target="right" href="../yxmb/20/index.html">
<div class="item"><div class="logo">
<img src="../images/y20.png" alt=" Coding"> 打砖块射击</div>
<div class="desc">HTML5 canvas打砖块射击小游戏,颜色爆炸射击游戏</div></div></a>

<div><a target="right" href="../yxmb/21/index.html">
<div class="item"><div class="logo">
<img src="../images/y21.png" alt=" Coding"> 保卫星球射击</div>
<div class="desc">星球防御游戏,太空战机为阻止星球遭遇小行星撞击</div></div></a>

<div><a target="right" href="../yxmb/22/index.html">
<div class="item"><div class="logo">
<img src="../images/y22.png" alt=" Coding"> 吃豆人</div>
<div class="desc">按[空格]开始或暂停、继续,键盘方向键进行游戏</div></div></a>

<div><a target="right" href="../yxmb/23/index.html">
<div class="item"><div class="logo">
<img src="../images/y23.jpg" alt=" Coding"> 开心消消乐</div>
<div class="desc">支持PC端和移动端,一款三消游戏,游戏画面精美</div></div></a>

<div><a target="right" href="../yxmb/24/index.html">
<div class="item"><div class="logo">
<img src="../images/y24.png" alt=" Coding"> 俄罗斯方块</div>
<div class="desc">界面简洁,难度可选:简单、一般、困难,键盘操作</div></div></a>

<div><a target="right" href="../yxmb/25/index.html">
<div class="item"><div class="logo">
<img src="../images/y25.png" alt=" Coding"> 2048方块版</div>
<div class="desc">HTML5数字方块2048小游戏,兼容PC端和移动端</div></div></a>

<div><a target="right" href="../yxmb/26/index.html">
<div class="item"><div class="logo">
<img src="../images/y26.png" alt=" Coding"> 看图猜词</div>
<div class="desc">【不兼容PC端】更好体验请使用手机,多个关卡小游戏</div></div></a>

<div><a target="right" href="../yxmb/27/index.html">
<div class="item"><div class="logo">
<img src="../images/y27.png" alt=" Coding"> 弹球打砖块</div>
<div class="desc">弹球打砖块,左、右箭头键或移动鼠标,控制小球打砖块</div></div></a>

<div><a target="right" href="../yxmb/28/index.html">
<div class="item"><div class="logo">
<img src="../images/y28.png" alt=" Coding"> 小方块回家</div>
<div class="desc">基于jQuery.1.10.2.min.js制作,可以选关,共30关</div></div></a>

<div><a target="right" href="../yxmb/29/index.html">
<div class="item"><div class="logo">
<img src="../images/y29.png" alt=" Coding"> 双人五子棋</div>
<div class="desc">自适应分辨率,可随意调整棋盘大小,可设定棋盘规格(双人游戏)</div></div></a>

<div><a target="right" href="../yxmb/30/index.html">
<div class="item"><div class="logo">
<img src="../images/y30.png" alt=" Coding"> 射箭小游戏</div>
<div class="desc">TweenMax.min.js制作,鼠标控制射箭游戏,画一个箭头并发射它</div></div></a>

<div><a target="right" href="../yxmb/31/index.html">
<div class="item"><div class="logo">
<img src="../images/y31.png" alt=" Coding"> 飞机大战2.0</div>
<div class="desc">飞机大战小游戏,电脑和手机都可以玩,飞机自动发射子弹</div></div></a>

<div><a target="right" href="../yxmb/32/index.html">
<div class="item"><div class="logo">
<img src="../images/y32.png" alt=" Coding"> 简单闯关游戏</div>
<div class="desc">简单JS闯关小游戏,4个关卡,键盘上下左右操作闯关小游戏</div></div></a>

<div><a target="right" href="../yxmb/33/index.html">
<div class="item"><div class="logo">
<img src="../images/y33.png" alt=" Coding"> 重力球滚动</div>
<div class="desc">重力球滚动,用鼠标倾斜屏幕,将球体移动到正方形,当心地下的洞</div></div></a>

<div><a target="right" href="../yxmb/34/index.html">
<div class="item"><div class="logo">
<img src="../images/y34.png" alt=" Coding"> 头像迷阵消除</div>
<div class="desc">人物头像迷阵消除游戏,类似《宝石迷阵》类的方块消除类型小游戏</div></div></a>

<div><a target="right" href="../yxmb/35/index.html">
<div class="item"><div class="logo">
<img src="../images/y35.png" alt=" Coding"> 变色弹球跳台阶</div>
<div class="desc">HTML5变色弹球跳台阶小游戏,点击台阶可变换红,黄,紫等颜色台阶</div></div></a>

<div><a target="right" href="../yxmb/36/index.html">
<div class="item"><div class="logo">
<img src="../images/y36.png" alt=" Coding"> 最强眼力</div>
<div class="desc">很经典的猜谜小游戏,有三个杯子,猜猜金币在哪个杯子里</div></div></a>

<div><a target="right" href="../yxmb/37/index.html">
<div class="item"><div class="logo">
<img src="../images/y37.png" alt=" Coding"> 俄罗斯方块2.0</div>
<div class="desc">俄罗斯方块2.0面向对象方式写的,彩色俄罗斯方块游戏</div></div></a>

<div><a target="right" href="../yxmb/38/index.html">
<div class="item"><div class="logo">
<img src="../images/y38.png" alt=" Coding"> 双人五子棋2.0</div>
<div class="desc">自适应分辨率,原生js和canvas实现五子棋小游戏(双人游戏)</div></div></a>

<div><a target="right" href="../yxmb/39/index.html">
<div class="item"><div class="logo">
<img src="../images/y39.png" alt=" Coding"> 小人推箱子</div>
<div class="desc">原生JS编写,移动小人,把箱子全部推到小球的位置即可过关</div></div></a>

<div><a target="right" href="../yxmb/40/index.html">
<div class="item"><div class="logo">
<img src="../images/y40.jpg" alt=" Coding"> 经典扫雷</div>
<div class="desc">扫雷基于jquery.1.10.2.min.js制作,计时,有十面红旗标注雷区</div></div></a>

<div><a target="right" href="../yxmb/41/index.html">
<div class="item"><div class="logo">
<img src="../images/y41.png" alt=" Coding"> 英雄宝石块消消乐</div>
<div class="desc">上手简单,只需让三个及以上的同色人物横竖相连即可消除</div></div></a>

<div><a target="right" href="../yxmb/42/index.html">
<div class="item"><div class="logo">
<img src="../images/y42.png" alt=" Coding"> 赛车游戏</div>
<div class="desc">HTML5 Canvas赛车游戏动画,赛车游戏动画演示</div></div></a>

<div><a target="right" href="../yxmb/43/index.html">
<div class="item"><div class="logo">
<img src="../images/y43.png" alt=" Coding"> 大家来找茬</div>
<div class="desc">一款经典的游戏,在限定时间内,找出两幅图的不同之处</div></div></a>

<div><a target="right" href="../yxmb/44/index.html">
<div class="item"><div class="logo">
<img src="../images/y44.png" alt=" Coding"> 经典扫雷2.0</div>
<div class="desc">最短的时间内点击格子出现的数字找出所有非雷格子,同时避免踩雷</div></div></a>

<div><a target="right" href="../yxmb/45/index.html">
<div class="item"><div class="logo">
<img src="../images/y45.png" alt=" Coding"> 锅打灰太狼</div>
<div class="desc">游戏时间:60s,拼手速,殴打灰太狼+10分,殴打小灰灰-10分</div></div></a>



<a target="right" href="../yxmb/47/index.html">
<div class="item"><div class="logo">
<img src="../images/y47.png" alt=" Coding"> 兔子吃月饼</div>
<div class="desc">HTML5兔子吃月饼小游戏,适应手机端,用鼠标操控进行游戏</div></div></a>

<div><a target="right" href="../yxmb/48/index.html">
<div class="item"><div class="logo">
<img src="../images/y48.png" alt=" Coding"> 接金币</div>
<div class="desc">HTML5接金币小游戏,鼠标控制人物左右移动进行操作</div></div></a>

<div><a target="right" href="../yxmb/49/index.html">
<div class="item"><div class="logo">
<img src="../images/y49.png" alt=" Coding"> 灌篮高手</div>
<div class="desc">樱木花道的篮球主场30秒投篮,按住屏幕,力度条在红色区域时松手投篮</div></div></a>

<div><a target="right" href="../yxmb/50/index.html">
<div class="item"><div class="logo">
<img src="../images/y50.png" alt=" Coding"> 疯狂打企鹅</div>
<div class="desc">HTML5疯狂打企鹅手机游戏</div></div></a>

<div><a target="right" href="../yxmb/51/index.html">
<div class="item"><div class="logo">
<img src="../images/y51.png" alt=" Coding"> 吃月饼大赛</div>
<div class="desc">中秋吃月饼大赛游戏,鼠标点击进行游戏,在一定的时间内看谁吃的多</div></div></a>

<div><a target="right" href="../yxmb/52/index.html">
<div class="item"><div class="logo">
<img src="../images/y52.png" alt=" Coding"> 坦克大战</div>
<div class="desc">以坦克战斗及保卫基地为主题,可一人游戏或两人进行游戏</div></div></a>

<div><a target="right" href="../yxmb/53/index.html">
<div class="item"><div class="logo">
<img src="../images/y53.png" alt=" Coding"> 图像之谜拼图</div>
<div class="desc">游戏分为简单、中等、困难,三个难度等级,记录操作步骤,纯html编写</div></div></a>

<div><a target="right" href="../yxmb/54/index.html">
<div class="item"><div class="logo">
<img src="../images/y54.png" alt=" Coding"> 消除QQ表情</div>
<div class="desc">消除QQ表情小游戏,你的手速有多快?</div></div></a>

<div><a target="right" href="../yxmb/55/index.html">
<div class="item"><div class="logo">
<img src="../images/y55.png" alt=" Coding"> 飞机躲避</div>
<div class="desc">HTML5游戏,长按屏幕飞机向上飞行,撞击障碍物游戏失败</div></div></a>

<div><a target="right" href="../yxmb/56/index.html">
<div class="item"><div class="logo">
<img src="../images/y56.png" alt=" Coding"> 3D熊出没</div>
<div class="desc">3D熊出没手机游戏基于HTML5 canvas制作,手机触屏操作更好</div></div></a>

<div><a target="right" href="../yxmb/57/index.html">
<div class="item"><div class="logo">
<img src="../images/y57.png" alt=" Coding"> 3D拼图魔方</div>
<div class="desc">3D拼图魔方游戏基于HTML5 canvas制作,一共12关</div></div></a>

<div><a target="right" href="../yxmb/58/index.html">
<div class="item"><div class="logo">
<img src="../images/y58.png" alt=" Coding"> 3D拳王拳击</div>
<div class="desc">3D拳王拳击游戏基于HTML5 canvas制作,支持鼠标操作</div></div></a>

<div><a target="right" href="../yxmb/59/index.html">
<div class="item"><div class="logo">
<img src="../images/y59.png" alt=" Coding"> 围住神经猫</div>
<div class="desc">基于HTML5 canvas、egret_loader.js和jquery.min.js等技术制作</div></div></a>

<div><a target="right" href="../yxmb/60/index.html">
<div class="item"><div class="logo">
<img src="../images/y60.png" alt=" Coding"> 2048军旗版</div>
<div class="desc">2048军旗版游戏,基于html5+js制作。键盘上下左右按键,开始游戏</div></div></a>

<div><a target="right" href="../yxmb/61/index.html">
<div class="item"><div class="logo">
<img src="../images/y61.png" alt=" Coding"> 打地鼠</div>
<div class="desc">打地鼠小游戏是基于HTML5 Canvas和Audio开发的小游戏</div></div></a>

<div><a target="right" href="../yxmb/62/index.html">
<div class="item"><div class="logo">
<img src="../images/y62.png" alt=" Coding"> 驴子跳跳</div>
<div class="desc">很漂亮的一款HTML5+CSS3游戏,还配有音乐,很酷很刺激</div></div></a>

<div><a target="right" href="../yxmb/63/index.html">
<div class="item"><div class="logo">
<img src="../images/y63.png" alt=" Coding"> 压扁像素小鸟</div>
<div class="desc">你恨flappy bird吗?你每天晚上对着那个愚蠢的鸟做噩梦吗?压扁它们!</div></div></a>

<div><a target="right" href="../yxmb/64/index.html">
<div class="item"><div class="logo">
<img src="../images/y64.png" alt=" Coding"> 像素小鸟飞行</div>
<div class="desc">游戏中玩家必须控制一只胖乎乎的小鸟,跨越由各种不同长度水管组成的障碍</div></div></a>

<div><a target="right" href="../yxmb/65/index.html">
<div class="item"><div class="logo">
<img src="../images/y65.png" alt=" Coding"> 中国象棋</div>
<div class="desc">HTML5+JS编写,效果很逼真,一点也不会出现卡的情况效果相当不错(小星美化)</div></div></a>

<div><a target="right" href="../yxmb/66/index.html">
<div class="item"><div class="logo">
<img src="../images/y66.png" alt=" Coding"> 经典飞机大战</div>
<div class="desc">经典飞机大战是一款JS模仿微信打飞机游戏</div></div></a>
<!--↑↑↑以上66个小游戏出自【源码之家www.mycodes.net】↑↑↑-->

<!--↓↓↓以下14个小游戏出自【A5源码www.a5xiazai.com】↓↓↓-->
<div><a target="right" href="../yxmb/67/index.html">
<div class="item"><div class="logo">
<img src="../images/y67.png" alt=" Coding"> 简约打地鼠</div>
<div class="desc">一款锻炼反应能力的打地鼠手机小游戏(只适应手机端)</div></div></a>

<div><a target="right" href="../yxmb/68/index.html">
<div class="item"><div class="logo">
<img src="../images/y68.png" alt=" Coding"> 切积木</div>
<div class="desc">切积木益智游戏是一款基于canvas画布制作切换积木立方体游戏</div></div></a>

<div><a target="right" href="../yxmb/69/index.html">
<div class="item"><div class="logo">
<img src="../images/y69.png" alt=" Coding"> 见缝插口红</div>
<div class="desc">见缝插口红手机游戏是一款口红西瓜见缝插针手机游戏(直男福利)</div></div></a>

<div><a target="right" href="../yxmb/70/index.html">
<div class="item"><div class="logo">
<img src="../images/y70.png" alt=" Coding"> 记忆小游戏</div>
<div class="desc">记忆小游戏代码是一款基于svg卡通图标匹配记忆游戏</div></div></a>

<div><a target="right" href="../yxmb/71/index.html">
<div class="item"><div class="logo">
<img src="../images/y71.png" alt=" Coding"> 看图猜词2.0</div>
<div class="desc">给你一张图片,在下列文字里选择组合一个成语,答对进入下一关(手机端更好)</div></div></a>

<div><a target="right" href="../yxmb/72/index.html">
<div class="item"><div class="logo">
<img src="../images/y72.png" alt=" Coding"> 萝卜载兔子飞行</div>
<div class="desc">基于canvas绘制的3D兔子载着胡萝卜飞行穿过云层的游戏,单击鼠标拖动控制方向</div></div></a>

<div><a target="right" href="../yxmb/73/index.html">
<div class="item"><div class="logo">
<img src="../images/y73.png" alt=" Coding"> 16宫格翻牌匹配</div>
<div class="desc">一款16宫格的翻牌图标匹配游戏,翻开两个图标一样,进行匹配小游戏</div></div></a>

<div><a target="right" href="../yxmb/74/index.html">
<div class="item"><div class="logo">
<img src="../images/y74.png" alt=" Coding"> 一笔连珠</div>
<div class="desc">点击每个圆珠来让线段进行连接,不可重复点亮,全部点亮即闯关成功</div></div></a>

<div><a target="_blank" href="../yxmb/75/index.html">
<div class="item"><div class="logo">
<img src="../images/y75.png" alt=" Coding"> 森林协奏曲</div>
<div class="desc">鼠标点击消除箱子等物体使动物们团圆,游戏加载完毕点击开始游戏(50个关卡)</div></div></a>

<div><a target="right" href="../yxmb/76/index.html">
<div class="item"><div class="logo">
<img src="../images/y76.png" alt=" Coding"> 斗地主</div>
<div class="desc">由三人玩,地主是一方,其余两家为另一方,双方对战,先出完的一方胜</div></div></a>

<div><a target="right" href="../yxmb/77/index.html">
<div class="item"><div class="logo">
<img src="../images/y77.png" alt=" Coding"> 飞机加减速</div>
<div class="desc">一款基于HTML5 Canvas实现的小游戏,圆形的加速,方形减速(手机端更好)</div></div></a>

<div><a target="right" href="../yxmb/78/index.html">
<div class="item"><div class="logo">
<img src="../images/y78.png" alt=" Coding"> 响应式翻牌</div>
<div class="desc">一款支持PC端跟手机端的小游戏,选择2个一样的即可抵消</div></div></a>

<div><a target="right" href="../yxmb/79/index.html">
<div class="item"><div class="logo">
<img src="../images/y79.png" alt=" Coding"> 天降红包雨</div>
<div class="desc">疯狂抢红包,天降红包雨,看看你的手速怎么样?抢到手软</div></div></a>


                <div class="box">
                </div>
        </section>
 
</body>
</html>

码云:

www.wouldplay.cn: 纯HTML小游戏,纯js小游戏,3D魔方,一个不能死,五子棋,消消乐,飞机大战,黑客模拟器

转载请注明出处或者链接地址:https://www.qianduange.cn//article/19730.html
标签
评论
发布的文章
大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!