降低背景图片background-image 重复频次或者说密度的方法

看图

假设现在我们觉得这个背景图片重复频率太高太密了怎么办？有办法降低密度吗？

一个方法是改背景图片，把边上的空白区域扩大，这样就实现降低密度的要求。但是如果这个图片我们不想改或者改不了的话怎么办。

我把background的相关属性看了一遍也没看到想要的css属性，那传统的方法肯定不行了，这里给一个解决方法。

我们先弄一张png图片，大概就像下图一样

至于为什么是这个形状，大家可以思考一下。

然后 改下 background-image: url(遮罩.png), url(back.gif); 将上面这张图片也就是遮罩放在背景图片前面。实现多背景图片。然后我们看下效果。

完美！