How To Add 3D Flip Effect To an image in Blogger using CSS3

CSS3 3D Flip Effect To an image in Blogger:Every one is adding images to Blogger , yeah it's damn true but why not you add it uniquely ? That is 3D Flip effect using CSS3 . CSS3 has just brought the revolution to the web world , playing with the codes you can rotate your images , objects , buttons etc in any degree . Moreover you can apply your own custom colors to enhance the effect of design of your blog , websites etc.Let's play with this awesome feature of CSS3 to add 3D Flip Effect To an image in Blogger.In this tutorial you will have to deal with 2 codes , one is simple some divs tags and other one is CSS for styling image.
*.Actually i have made it very simple for you guys , you just have to add your image link in the script .
*.First of all Go To Post Section , Click on Create Post and then switch into HTML Section copy the below script and paste it over there.

Caption text goes over here!

*. Replace yourimage.jpg with your desired image url.
*.and in the figcaption tags add the text you want to appear on hovering the image.
*.Now Just Copy the below CSS code and paste it just below the above script

*.You can also play with the different properties and selectors of CSS by changing the above Code , but if you are new to CSS just add the image url and caption text , don't edit it if you are new to programming!