Css 包含特定形状的背景(如钻石)

Css 包含特定形状的背景(如钻石),css,image,layout,transparency,shapes,Css,Image,Layout,Transparency,Shapes,我试着把背景限定在一个特定的形状上 示例:我有一个方形的div或img标签。然后,我希望它的一部分(角落)是透明的,另一部分(中间的钻石)是某种颜色(有背景色)或某种图像(有背景图像) 我可以通过制作一个中间有一个透明菱形的白色png文件,并将图像的背景设置为我想要的,这样背景只以菱形的形状显示出来,来模拟这种情况 我想去掉边缘周围显示的白色部分(例如,有一个透明的png,中间有一个白色菱形),但是背景只会在边缘上显示出来。因此,基本上,我希望图像上的背景显示不透明的位置,而不是透明的位置。我几

我试着把背景限定在一个特定的形状上

示例:我有一个方形的div或img标签。然后,我希望它的一部分(角落)是透明的,另一部分(中间的钻石)是某种颜色(有背景色)或某种图像(有背景图像)

我可以通过制作一个中间有一个透明菱形的白色png文件,并将图像的背景设置为我想要的,这样背景只以菱形的形状显示出来,来模拟这种情况

我想去掉边缘周围显示的白色部分(例如,有一个透明的png,中间有一个白色菱形),但是背景只会在边缘上显示出来。因此,基本上,我希望图像上的背景显示不透明的位置,而不是透明的位置。我几乎可以肯定这与图像有关,但如果你有其他选择,请告诉我


这里有一个例子。你可以看到所有的图像都有白色的边缘,应该是透明的,所以下面的图像不会显示出来。我仍然需要能够改变的背景颜色在最后与css

它没有最好的支持,但确实存在


它们听起来好像能达到你想要的效果。

你需要去掉白色部分,使它们真正透明。仅仅让文件以.png结尾并不能解决这个问题。你有Photoshop或类似的程序吗?如果是这样的话,只需画出你想要的部分,剩下的就空了。哇!这将是完美的,除了它只适用于狩猎。我想我可能找到了一个完全不同的方法,但是谢谢你的帮助!