How to change color of png on hover?

Question

I made a \"down arrow\" in illustrator and saved it as a png with a transparent background. When I put it into my webpage as an img, it shows up in the original color, which

Answer 1

Applying:

{color:red}

to any element means changing text color.

Try changing:

img:hover {color:red}

to:

img:hover {background-image: url('');}

and this works if you only have one image. If you have many images and you want only one to change on hover, then set an ID for the image you want to change and change img and img:hover to #x and #x:hover and replace x with the name you given for the ID.

Here's an example (assume other HTML is intact and properly formatted):