Zmiana obrazka po najechaniu css

Hejka
jak po najechaniu na obrazek zmienić go?

<a id="img" href="#"><img src="_img/1.jpg" alt="1" /></a>

i css

#img:hover{
	background: url("2.jpg") no-repeat;
}

co mogę robić źle?

A co tam masz dobrze?
Przecież background znacznika a jest przykryty przez obrazek z img.

background elementu <a> to nie to samo atrybut src elementu <img>.

<a id="img" href="#"></a>

#img {
        background: url("1.jpg") no-repeat;
        display: inline-block;
        /* podaj tez width i height */
}
#img:hover {
        background: url("2.jpg") no-repeat;
}

Pamiętaj, że musisz nadać wysokość i szerokość samodzielnie.

Powinieneś tak naprawdę wpisać w tag jakiś tekst alternatywny (np. dla przeglądarek tekstowych oraz wyszukiwarek, które zdjęć nie analizują tylko tekst) i ukryć go za pomocą color: transparent; font-size: 0; albo podobnym sposobem