Using CSS background image on HTML image element

Pascal Opitz replys the question "can you set an image background on an image element?" in simple fashion. All you have to do is make sure that the image is display: block and has a padding. He put up a simple demo that uses a div with an image, and he applies backgrounds to both: div […]

Share online:

Pascal Opitz replys the question "can you set an image background on an image element?" in simple fashion. All you have to do is make sure that the image is display: block and has a padding. He put up a simple demo that uses a div with an image, and he applies backgrounds to both:

div {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; background: url('blur.jpg') no-repeat top left;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width: 232px;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height: 200px;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br />}<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br />img {<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; display: block;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; background: url('parallax.gif') no-repeat bottom left;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; padding: 93px 100px 75px 100px;<br />}

Demo

Source:→ Ajaxina

About The Author

Deepak Gupta is a IT & Web Consultant. He is the founder and CEO of diTii.com & DIT Technologies, where he's engaged in providing Technology Consultancy, Design and Development of Desktop, Web and Mobile applications using various tools and softwares. Sign-up for the Email for daily updates. Google+ Profile.