Javascript 将鼠标悬停在<；中时，如何完全更改图像的颜色；a>；标记元素？

我有一个示例代码，它悬停在图像上以更改背景颜色。悬停时如何用颜色填充整个图像

在我的代码片段中，它只填充标记元素的背景色，而不填充图像

这是一张进一步澄清我的问题的图片

如何在标记元素中使用悬停效果来实现这一点

a img：悬停{
背景颜色：紫色；
}
a:悬停{
背景颜色：黄色；
}

假设您的图像是白色的，而其他部分是透明的。只需更改CSS，如下所示：

img{
背景颜色：紫色；
}
a:悬停img{
背景颜色：黄色；
}

我找到了另一种改变背景图像的方法。我想有两个图像，所以当它悬停时会改变图像。谢谢@Jaromanda X提供的信息

#我的img：悬停{
内容：url（'images/pinkcart.png'）；
}

使用jQuery尝试以下解决方案：

a img：悬停{
背景颜色：紫色；
}
a:悬停{
背景颜色：黄色；
}

请更新样式

a{
     padding:15px;
     background-color: purple;
     display:block;
}
a:hover {
    background-color: yellow;
}

---

更改CSS背景图像属性：悬停是单纯形方式。。。如果它确实是一个图像-如果它是一个来自某种奇特字体的字形，那么只需将CSS背景颜色属性更改为on:HOVER就可以根据图像，在

none

和

inline

之间切换它的

display

CSS属性。如果图像是svg，也可以为图像本身着色。