Css image opacity

Hi friends in this post I am sharing about css image opacity.Css image opacity is used to make images transparent.

Copy and paste the below code in notepad and save in”.html” format(be sure you have added an image from your pc and replace path in yellow highlighted color) and open with browser.For internet explorer , we are using filter: alpha(opacity=40); .If filter: alpha(opacity=0); the image will be more transparent.

If filter: alpha(opacity=100); the image will not have a transparent effect.Like the same for “opacity:0.4;” the image transparent will be more when it is “opacity:0.1;” .And the image will not have transparent effect when it is “opacity:1.0;” .

<style>

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

opacity: 1.0;
    filter: alpha(opacity=100);
}
</style>
<body>

<div>
<img src="D:/desk/pencil-icon.png" width="auto" height="auto">


</div>
</body>