当鼠标悬停在 <a> 标签元素中时，如何完全改变图像的颜色？
用户4873951
我有这个示例代码，它悬停图像以更改背景颜色。悬停时如何用颜色填充整个图像？
在我的代码片段中，它只填充 a 标签元素的背景颜色，而不是图像。
这是进一步澄清我的问题的图像。
如何使用标签元素中的悬停效果来实现这一点。
a img:hover {
background-color: purple;
}
a:hover {
background-color: yellow;
}<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!-- Hovered with image no text -->
<a href="https://www.w3schools.com"><img src="cart.png"></a>
<!-- Hovered without image just text -->
<a href="http://www.wikipedia.org">Change color text</a>
</p>
</body>
</html> 用户4873951
我找到了另一种更改背景图像的方法。我想有两个图像，所以当悬停时它会改变图像。感谢您的信息@Jaromanda X
#my-img:hover {
content: url('images/pinkcart.png');
}<!DOCTYPE html>
<html>
<head>
</head>
<body>
<img id="my-img" src="images/redcarticon.png"/>
</p>
</body>
</html>也感谢大家对我的帮助。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
当鼠标悬停在悬停元素上时，如何设置悬停效果继续显示？
- 2
当鼠标悬停在悬停元素上时，如何设置悬停效果继续显示？
- 3
当鼠标悬停在其下方的文本上时，如何使标记改变颜色？
- 4
当鼠标悬停在圆圈上时，圆圈不会改变颜色
- 5
当鼠标悬停在li：之前时，如何更改链接的颜色？
- 6
当鼠标悬停在DIV中时更改H2颜色
- 7
当鼠标悬停在上方时，如何使图像淡入？
- 8
当鼠标悬停在图像底部时如何允许调整大小？
- 9
当鼠标悬停在 Ubuntu 20.04 中时，如何使 Ubuntu Dock 中的图标滑动？
- 10
当鼠标悬停在JavaFX中的按钮上方时，如何创建节点（圆）？
- 11
当鼠标悬停在elm（elm-ui）中时，如何使文本删除线？
- 12
当鼠标悬停在 Javascript 中时，如何使链接可见？
- 13
当鼠标悬停在不同颜色上时，传单突出显示标记
- 14
当鼠标悬停在不同颜色上时，传单突出显示标记
- 15
当鼠标悬停在特定的div时如何使mouseleave功能停止
- 16
当鼠标悬停在数据点上时如何显示工具提示
- 17
当鼠标悬停在Emacs / gdb中时显示变量的值？
- 18
当鼠标悬停在Jssor中的缩略图菜单上时显示字幕
- 19
当鼠标悬停在图例点上时，CanvasJs在图表中隐藏某些线
- 20
当鼠标悬停在按钮上时，下拉菜单不显示
- 21
当鼠标悬停在嵌入式iframe上时，防止父页面滚动
- 22
当鼠标悬停在子菜单上时，ASP动态菜单子菜单消失。
- 23
当鼠标悬停在对象上时，使该对象出现
- 24
当鼠标悬停在div上时，使其保持可见状态
- 25
CSS3，当鼠标悬停在父div上时显示或隐藏子div
- 26
仅当鼠标悬停在其上时显示div
- 27
当鼠标悬停在输入文本框上时显示一些文本
- 28
当鼠标悬停在网格上时显示/隐藏网格行
- 29
当鼠标悬停在双引号上时，停止Eclipse以显示文档
我来说两句