如何在鼠标翻转时更改图像<img/>（悬停）

Question

如何更改图片（使用<img>标记进行设置，该标记不是<div>或<some_selector>背景，可以通过更改background或{来轻松解决鼠标翻转（悬停）上的background-image上的{1}}属性，如stackoverflow主页中的收藏夹标记删除按钮，其中（X）图像在悬停时变为红色？ / p>

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