<html>
<head>
<meta charset="GBK">
<title>test</title>
<style type="text/css">
*{
box-sizing: border-box
margin: 0
padding: 0
}
.container{
width: 90px
height: 90px
}
.item{
width: 30px
height: 30px
display: block
float: left
}
</style>
</head>
<body>
<div class="container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
</body>
</html>
<script type="text/javascript">
var items = document.querySelectorAll('.item')
Array.prototype.slice.call(items, 0).forEach(function(item){
item.style.backgroundColor = '#'+(~~(Math.random()*(1<<24))).toString(16)
})
</script>
每个方格插入一个图片做触发器，设置相应内容的“进入”动画。方法：1、制作按钮。插入----形状----矩形------调整同方格大小-----右击矩形-----设置形状格式-----设置成无线条、填充透明度100%。放置在相应方格中。2、设置动画。选中该方格 要出现的对象-----动画-----自定义动画------添加效果------进入------飞入或出现。单击该动画效果后的下拉箭头------计时------触发器------单击下列对象时启动效果：选上面的矩形。最后把该对象拖入对应的方格中。其他方法相同。
