如何在鼠标悬停时更改<img>图像

Question

如何在鼠标悬停时更改<img>图像

5

如何在鼠标悬停时更改图片（使用<img>标签设置的图片，不是<div>或<some_selector>背景，在CSS中可以通过更改:hover上的background或background-image属性轻松解决），就像stackoverflow主页上的收藏标签删除按钮一样，在其中(X)图像在悬停时变为红色？

- Alfred

移除了标签“图像处理”。 - Ross

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Myles Gray · Accepted Answer

HTML

<div id="css-image-swap-1">
<img id="swap-1" src="default-image-url" alt="CSS image swap" />
</div>

CSS

#css-image-swap-1{
    width:300px; height:150px; background:url(swap-image-url);
}
#css-image-swap-1 img:hover{
    opacity:0;
}