翻牌匹配小游戏

说到这个翻牌匹配的小游戏大家都不陌生吧，两张一模一样的图片就会显示正确或者显示在页面上，翻到两张不一样的图片就会匹配失败，不会显示出来。首先让我们来看一下它的效果如下：

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