如何使用css更改悬停时图像的不透明度答案

【问题标题】：How to change the opacity of image on hover using css如何使用css更改悬停时图像的不透明度
【发布时间】：2013-08-15 22:18:09
【问题描述】：

我正在尝试弄清楚如何将所有图像设置为初始不透明度为 50%，然后更改为 悬停时为 100% 不透明度。

我尝试在.css 文件中设置此规则，但它给出了解析错误：

img {
  opacity:0.4;
  filter:alpha(opacity=40); 
}
img:hover {
  opacity:1.0;
  filter:alpha(opacity=100); 
}

【问题讨论】：

这个link 可能会有所帮助
是否还有更多我们没有看到的代码可以覆盖您的不透明度设置？
问题可能是您在<img> 标签上使用了:hover？在 <a> 标记以外的元素上使用悬停可能会导致某些版本的 ie 出现问题。
什么是解析错误？
嗯，很奇怪，现在可以正常使用了。我正在使用网络风暴。它只是发出警告

标签： jquery image css hover

【解决方案1】：

您的代码在这条 Fiddle 中通过了一条友好的鱼的良好验证：http://jsfiddle.net/Qrufy/

    img {
        opacity: 0.5;
        filter: alpha(opacity=40);
    }
    
    img:hover {
        opacity: 1.0;
        filter: alpha(opacity=100);
    }

    &lt;img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Colossoma_macropomum_01.jpg/800px-Colossoma_macropomum_01.jpg" /&gt;

opacity 属性适用于所有现代浏览器，filter:alpha 涵盖

【讨论】：

缩进正确？ OP的代码（至少他们发布的）是有效的，这就是重点:)