本文专门介绍如何使用CSS完成水波纹效果。层层的div虽然webkit有遮罩（webkitmask）的能力，webkit虽然强大，但是在跨浏览器中始终是它的遮罩，在性能上经常会造成麻烦（这也是chrome需要这样消耗资源的原因），那么撇开webkit不谈，我们应该用什么方法来制作水波纹的效果呢？答案是使用“堆叠”方法。这个水波纹效果的原理就是把六个div叠在一起，然后最主要的就是设置背景固定：background-attachment:fixed;，然后把背景的尺寸调大如果调小，它可以完成。只需将六个div堆叠在一起并使用CSS动画使六个div依次出现即可。HTML：
