Html 黑色图像淡入淡出图像

我的主页或index.html上有一个图像，我希望能够将鼠标悬停在该图像上，然后黑色图像以低不透明度淡出

示例：-如果您将鼠标悬停在其中一幅图像或产品上，您可以看到我正在尝试完成的褪色类型的事情。我对HTML和CSS以及脚本之类的东西都是相当陌生的。我假设这与CSS有关，例如，悬停等等

---

提前谢谢

我想你想要这样的东西-

.wrap{位置：相对；高度：100px；宽度：120px；} .wrap img{宽度：100%；高度：100%；} .effect{背景：rgba0,0,0,5；；位置：绝对；高度：100%；宽度：100%；顶部：0；显示：无；} .wrap:hover.effect{显示：块；不透明度：.4} 文本

---

您可以使用CSS3动画和：悬停来完成此操作

.包裹{ 宽度：100px； 高度：100px； 位置：相对位置； } .效果{ 位置：绝对位置； 排名：0； 左：0； 宽度：100px； 高度：100px； 背景：无； /*首先，我们需要帮助一些浏览器来实现这一点。 仅仅因为有供应商前缀，并不意味着它会 也可以在该供应商生产的浏览器中工作，这只是为了 我想是为了证明未来*/ -o-转变：.5s； -ms转换：.5s； -moz转变：.5s； -webkit转换：.5s； /*…现在是正确的财产*/ 过渡：.5s； } .效果：悬停{ 背景：rgba0,0,0,0.4； }

---

展示你的代码。除了onhover事件和几乎透明的~20%的不透明性之外，展示代码是没有意义的，因为我没有在另一个图像上添加一个图像，我不太确定怎么做，这就是为什么我问这个问题；你能给我一些关于如何做到这一点的代码吗？你可以使用jQuery.class.hover。。。。对,对!！但是，你能不能教我如何让它褪色，而不是让它变成黑色？你想让图像褪色还是让它变成黑色？@JoshMurray检查我发布的重复url：@BramDriesen我有，但我也得想办法让文字褪色