html5 / css中具有单一rgb透明颜色的重叠图像

Question

我想在我的html5程序中读取具有固定背景rgb颜色（例如（0,0,0））的图片（gif彩色图像），并将其覆盖在另一幅图像上，只有该背景色是透明的。 请注意，背景不是固定的形状-例如，天空中有飞过的前景鸟。 我只想看那只鸟。 我尝试了以下方法

<div style="z-index: 100; position: absolute; top: 39px; left: 72pix; background-color: #ffffff; opacity: 0.5">

<img alt="overlay image" src="overlay.gif" WIDTH=32 HEIGHT=32></div></div>

但这会使整个叠加层0.5透明。 我试过插入

<div style="background: rgba(0,0,0,0.0)"></div>

但这不会更改图像的rgb值，只会设置图像周围的实际背景。

Answer 1

您将无法仅使用CSS / HTML来执行此操作。 它将需要SVG或JavaScript。 类似问题的答案在这里 。