javascript - 向矩形光栅图像添加圆 Angular

Question

使用 CSS/JS/HTML 为图像制作圆 Angular 蒙版之类的最佳方法是什么？因此，我需要为矩形图像添加圆 Angular 。我考虑过添加 4 个像这样的图形元素 在图像 Angular 上方隐藏图像的一些小部分。例如，这里的红色是在红色背景页面上使用，元素是右上角。这个解决方案的问题是我不能在复杂的背景上使用它，比如渐变或其他非平面填充背景。我知道有一个可以在 FireFox 中使用的屏蔽功能，但我需要一些更通用的解决方案，这些解决方案也可以在其他浏览器中正常工作。谢谢。

Answer 1

您应该为此使用 CSS border-radius(如另一个答案中所述)。它确实适用于图像。

之前的答案遗漏的是，您可以在所有浏览器的 CSS 中支持它，包括 IE6/7/8，使用一个名为 CSS3Pie 的小技巧。 .