CSS如何用透明度而不是颜色绘制图像？答案

【问题标题】：CSS How to draw image with transparency instead of color?CSS如何用透明度而不是颜色绘制图像？
【发布时间】：2015-02-22 05:56:39
【问题描述】：

我有一个带有绿色背景颜色 rgb(41, 253, 46) 的 PCX 图像，当我通过 CSS 显示它时，我需要将此颜色显示为透明颜色。

我不熟悉 CSS 或 HTML，我花了几个小时才找到解决方案。虽然没有成功。任何想法如何做到这一点？

限制： 1）使用CSS 2）不要更改图像文件 3）使用这个图像文件（不是它的副本）

span#smlogo
{
    icon-decorator: image;
    icon-image-src: /ui_art/smlogo.pcx;
    icon-image-t-end: 154px;

    display: inline-block;
    width: 390px;
    height: 154px;
}

图像本身：

【问题讨论】：

icon... 不是有效的 CSS。你需要background-image。
这实际上不是 CSS。它是 RocketCSS，它基于 CSS2 和 CSS3 规范，具有一些高级功能来绘制游戏用户界面。但。由于它是基于 CSS2 并具有 CSS3 的一些功能，我希望有一个解决方案来做到这一点。
使用 Photoshop 并用透明度替换绿色不是更容易吗？
如果 photoshop 不是一个选项，然后尝试CSS masking/clip path
蒙版是我认为的一个选项，但找不到一个选项，可以从图像中创建具有特定颜色的蒙版

标签： css image transparency pcx

【解决方案1】：

为了显示透明度，您需要使用

rgba(41,253,46,.5)

最后的 .5 是我选择的随机 alpha 值。它可能在 0.0-1.0 之间，其中 1.0 完全不透明。

希望这会有所帮助！ :D

【讨论】：

好吧。我不想让整个画面透明。我只想在颜色匹配 rgb(41, 253, 46) 的地方使其透明。我将添加一张图片以便更好地了解我想要获得的内容。
全貌：我有一个 .MPQ 文件，其中包含资源。我有一个处理这些资源的代码。人们从不同的来源获得这个 .MPQ 文件，所以我可以修改它，但它只会影响我。所以解决方案是更改显示该资源的代码。所有人的代码都是一样的，因为它在 GitHub 上。