html - 为背景图像着色

Question

我需要根据 rgb 值对便利贴图像（就像这里的这个）进行着色。

我的问题如下：图像的外部部分需要是透明的，因为图像放置在不同背景颜色的前面。

其次，我需要将图像的当前黄色更改为给定的 rgb 值。（非动画）

我首先考虑使图像的黄色部分也透明，然后在其上放置一个彩色元素。但这也会使外部部分着色，这些部分应该与文档背景色保持一致。

有什么想法吗？

在此先感谢，沃伊采克

Answer 1

<canvas>您可以通过为元素中绘制的图像着色来做到这一点。（参见此处的示例），然后生成可用于显示图像的数据 URI。

不确定这可以用纯 CSS 完成，但我很想被证明是错误的 :)

Answer 2

感谢您的快速建议！

我相信它们也会起作用。但我在这里遇到了另一个对我有用的好解决方案。

完全是 CSS，但它当然不像我之前尝试的那样使用图像。