如何在鼠标滚动（悬停）改变图像<img>

Question

如何更改的图像（设定使用<img>标签，其不是<div>或<some_selector>背景，即可以通过改变background或在上:hoverbackground-image属性容易解决CSS）鼠标翻转（悬停）像喜欢的标签删除按钮在stackoverflow主页，其中（X）图像变成红色悬停？

Answer 1

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; 
}