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

Im trying to figure out how to set all images to be say 50% opacity initially, and then change to 100% opacity on hover

我试图弄清楚如何设置所有图像最初说50%不透明度,然后在悬停时更改为100%不透明度

I tried setting this rule in the css file but it does not work. I gives a parse error:

我尝试在css文件中设置此规则,但它不起作用。我给出了一个解析错误:

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

1 个解决方案

#1

Your code is good- verified in this Fiddle with a friendly fish: http://jsfiddle.net/Qrufy/

你的代码在这个小提琴中得到了很好的验证,有一条友好的鱼:http://jsfiddle.net/Qrufy/

<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Colossoma_macropomum_01.jpg/800px-Colossoma_macropomum_01.jpg" />

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

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

The opacity property works in all modern browsers, and the filter:alpha covers <= IE8.

opacity属性适用于所有现代浏览器,而filter:alpha涵盖<= IE8。

#1