html - 反转alpha png图片

Question

我有一个包含白色和 alpha(透明)像素的小图标 png 图片。我可以使用 css(首选)或 javascript 以某种方式“反转”该图标以获得:

白色像素 -> 透明像素

透明像素 -> 白色像素

我看到有一些新的 css 属性，例如 filter 和 mask，但并非所有主流浏览器都支持它们。

Answer 1

我认为最简单快捷的方法是创建第二张已经倒置的图像。假设你想在悬停时反转图片，你可以使用 :hover css 类来交换 2 个图像。

    #divId:hover{background-image: url('imageName.ext') }