原生js实现自定义难度的扫雷游戏

2023-07-06 10:56:03 192

*{ margin:0; padding:0; } .gameBox{ margin-top:30px; } body{ font-size:0; } ul{ list-style:none; text-align:center; overflow:hidden; } .col{ display:inline-block; width:22px; height:22px; line-height:22px; background-color:rgba(32,226,255,0.4); border:1pxsolidrgb(129,129,129); font-size:16px; margin:1.5px; vertical-align:top; position:relative; } .col:hover{ background-color:#0af; } .colspan{ cursor:default; } .hide{ display:none; } .boom{ background:url("../img/boom.svg")no-repeat2.5px2px; background-size:18px18px; } .num-1{ color:rgb(8,153,235); } .num-2{ color:rgb(255,45,178); } .num-3{ color:#16a085; } .num-4{ color:#8e44ad; } .num-5{ color:rgb(255,167,45); } .num-6{ color:rgb(8,126,176); } .num-7{ color:#e67e22; } .num-8{ color:#c0392b; } .img-flag{ width:18px; height:18px; position:absolute; top:3px; left:3px; } .level{ margin-top:30px; font-size:20px; text-align:center; } .levelbutton{ padding:5px8px; background-color:rgb(67,183,189); border:none; outline:none; border-radius:3px; cursor:pointer; color:#fff; } .levelbutton:hover{ background-color:rgb(23,132,138); } .info{ margin-top:30px; font-size:16px; text-align:center; } .infop{ display:inline-block; width:130px; margin:0auto; } .infopspan{ color:rgb(67,183,189); }

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

原生js实现自定义难度的扫雷游戏

1、html相关代码

2、css样式

3、js代码

随机推荐

原生js实现自定义难度的扫雷游戏

1、html相关代码

2、css样式

3、js代码

热门推荐

随机推荐