HTML5通知图像中的圆角

Question

是否可以在HTML5通知中显示圆角的图像？

我说的是这个HTML5 API：

new Notification(title, { icon: imageURL });

Answer 1

我不认为有一个带有圆角的图标显示选项。

但是解决方案可能是通过使用HTMLCanvas创建新图片来使Image圆角化：

• 创建具有图像宽度和高度的画布元素
• 在画布元素context.drawImage(img,x,y);上绘制图像context.drawImage(img,x,y);
• 绘制圆角或使用剪切路径剪切
• 保存图片以将其用于通知var dataURL = canvas.toDataURL();

编辑：这是“ Web通知”的完整规范： https : //dvcs.w3.org/hg/notifications/raw-file/tip/Overview.html-您只能定义图片/图标，没有样式属性，所以是的，您将自己修改图像