如何在<a>标签内的鼠标上方反转png图像的颜色？
如何在<a>标签内的鼠标上方反转png图像的颜色？
提问于 2014-03-27 14:59:23
我在bootstrap 3上工作，在那里我创建了一个侧边导航栏，并想要在锚标签内放置一个图像，该标签在list标签内。我想反转鼠标悬停图像的颜色，但这是不可能的。鼠标悬停时不会发生任何效果。如果有人能帮上忙那就太好了。
下面是我的代码：
HTML：
<ul class="nav nav-pills nav-stacked" data-role="panelbar" style="height: 600px;">
<li>
<a>
<span class="glyphicon glyphicon-user glyph-width"></span>Group Name
<span id="edit-img" class="img-span pull-right">
<img src="images/glyphicons/Data-Edit.png">
</span>
</a>
</li>
</ul>CSS：
#edit-img :hover {
-webkit-filter: invert(100%) !important;
}我无法在鼠标悬停时反转Data-Edit.png的颜色。请帮帮忙。
Stack Overflow用户
发布于 2014-03-27 15:14:50
编辑：
检查此DEMO
它在这种情况下有效，在你的情况下也应该有效。
您必须将其应用于img标记
#edit-img:hover img{
-webkit-filter: invert(100%) !important;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22680413
复制相关文章
相似问题
腾讯云开发者
