本文主要是介绍翻牌匹配小游戏，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
说到这个翻牌匹配的小游戏大家都不陌生吧，两张一模一样的图片就会显示正确或者显示在页面上，翻到两张不一样的图片就会匹配失败，不会显示出来。首先让我们来看一下它的效果如下：
HTML页面布局代码如下：
<div class="container"><header><h1>匹配游戏</h1></header><div class="score-panel"><ul class="stars"><li><i class="fa fa-star"></i></li><li><i class="fa fa-star"></i></li><li><i class="fa fa-star"></i></li></ul><span class="moves">0</span> <div class="restart" onClick="run()"><i class="fa fa-repeat"></i><!--Font Awescome中文网--></div></div><ul class="deck" id="deck"></ul>
</div>
Css样式如下：
html {box-sizing: border-box;
}*,
*::before,
*::after {box-sizing: inhe这篇关于翻牌匹配小游戏的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
