停止填充DIV的背景颜色

Question

我有一个带透明区域的PNG图像。这有点像带有锯齿形边缘的结账收据撕裂。它将位于具有白色背景的div的底部，以模拟收据。我试过这个如下。

 background: #ffffff url("../images/zigzag.png") bottom right no-repeat; 

但背景白色填充到图像的边缘

除了创建另一个div之外还有一种方法可以阻止图像下的背景颜色吗？

Answer 1

使背景颜色透明：

#foo {
  background: transparent url(yourzig-zagImage) no-repeat 0 0;
}

Answer 2

添加另一个div可能是最干净的解决方案。

但是，如果div的高度有限，您可以改为使div的背景透明并使用白色像素扩展“粗糙边缘”图像的顶部，直到它变高足以使它始终为div的主要部分提供白色背景。