html - Replacing an image (in an <img /> tag) using css

Question

I have the following html:

<div class="A">
    <img src="image1.png" width="100px" height="100px"/> 
</div>

In my media queries css style sheet, I would like to replace that image with another one (image2.png).

What is the css code I need to write?

I tried the following:

.A img
{
   background:url("image2.png") no-repeat;
}

But this doesn't seem correct?

Answer 1

If you are using CSS3, then content is the answer:

.A img
{
    content: url("image2.png");
}