How to make an element transparent so that the background shows through | Using CSS

To make elements transparent we need use the Opacity property and give it value less than 1, why less than 1 because one is the default value and the elements will appear as they are without any transparency, giving the elements a value less than 1 will make it transparent.

opacity using CSS
without opacity

HTMl Code
<img src="My Image.jpg" alt="My Image" id="firstimage"/>
<img src="My Image.jpg" alt="My Image" id="secondimage" />

CSS Code
body{ background-image:url(bg.jpg);}
body img{ width:350px; height:250px; padding-left:5%; padding-top:18%;}
#secondimage{ opacity:0.5;}

opacity using CSS
with opacity


Popular posts from this blog

Advanced Jquery easing | Demo and Download