首页

JS特效

其它特效

贪吃蛇网页小游戏的代码

立即下载预览

<风格>
::选择{
颜色:#FFFFFF;
背景：透明；
}
::-moz-选择 {
颜色:#FFFFFF;
背景：透明；
}
* {
# 保证金：0；
填充：0;
字体系列：“VT323”;
}
身体 {＃＃＃背景颜色:#000000;
}
。裹 {＃＃＃左边距：自动；
右边距：自动；
}
标题 {
宽度：340px；
字体大小：0;
}
帆布 {＃＃＃显示：无；
边框样式：实心；
边框宽度：10px;
边框颜色：#FFFFFF;
}
画布：焦点{
大纲：无；
}
/* 顶级样式 */
h1 {
显示：内联块；
宽度：100px；
字体大小：32px;
颜色:#FFFFFF;
}
。分数 {＃＃＃显示：内联块；
宽度：240px；
字体大小：20px;
颜色:#FFFFFF;
文本对齐：右；
}
.score_value {
字体大小：继承；
}
/* 所有屏幕样式 */
#gameover a,#setting a,#menu a {
显示：块；
}
#gameover a,#setting a:hover,#menu a:hover {
光标：指针；
}
#gameover a:hover::before,#setting a:hover::before,#menu a:hover::before {
内容：“>”;
右边距:10px;
}
/* 菜单屏幕样式 */
＃菜单 {＃＃＃显示：块；
宽度：340px；
顶部填充：95px;
底部填充：95px;
字体大小：40px;
左边距：自动；
右边距：自动；
文本对齐：居中；
颜色:#FFF;
}
#菜单 h2 {
-webkit-animation:logo-ani 1000ms 线性无限;
动画：logo-ani 1000ms 线性无限；
下边距：30px;
}
#菜单a {
字体大小：30px;
}
@-webkit-keyframes 徽标-ani {
50% {
# -webkit-transform:scale(1.3,1.3);
}
100% {
# -webkit-transform:scale(1.0,1.0);
}
}@keyframes 徽标-ani {
50% {
# 变换：缩放(1.3,1.3);
}
100% {
# 变换：缩放(1.0,1.0);
}
}/* 游戏结束屏幕样式 */

＃游戏结束 {＃＃＃显示：无；
宽度：340px；
顶部填充：95px;
底部填充：95px;
左边距：自动；
右边距：自动；
文本对齐：居中；
字体大小：30px;
颜色:#FFF;
}
#游戏结束 p {
顶部边距：25px;
字体大小：20px;
}
/* 设置屏幕风格 */
＃环境 {＃＃＃显示：无；
宽度：340px；
左边距：自动；
右边距：自动；
顶部填充：85px;
填充底部：85px;
字体大小：30px;
颜色:#FFF;
文本对齐：居中；
}
#设置 h2 {
边距底部：15px;
}
#设置p {
顶部边距：10px;
}
#设置输入{
显示：无；
}
#设置标签{
光标：指针；
}
#设置输入：选中标签{
背景颜色：#FFF;
颜色:#000;
}
</风格>
</头>

<标题类=“换行”>
<h1>蛇</h1>
<p class="score">分数：<span id="score_value">0</span></p>
</标题>
<canvas class="wrap" id="snake" width="320" height="320" tabindex="1"></canvas>

设置

新游戏
<p>速度：
<输入 id="speed1" type="radio" name="speed" value="120" 已选中/>
<标签=“速度1”>慢
<输入 id="speed2" type="radio" name="speed" value="75" />
<标签=“速度2”>正常

<标签=“速度3”>快速
</p>

贪吃蛇网页小游戏代码是一款简单的黑白风格好玩的在线网页小游戏特效。

免责声明

本站所有资源均由网友贡献或各大下载网站转载。请自行检查软件的完整性！本站所有资源仅供学习参考。请不要将它们用于商业目的。否则，一切后果由您负责！如有侵权，请联系我们删除。联系方式：admin@php.cn