
y al pasar el mause se opaque un poco y salga otra imagen asi:

El resultado de todo esto es asi:
El código HTML de este es:
Código HTML :
<ul><li><a href="http://shop.lockerz.com/electronics/skullcandy.html"><img class="dim category-image" id="nav-image-taxonomy1005" src="http://shop.lockerz.com.s3.amazonaws.com/enterprise/catalogevent/resized/150-150-skullcandy_nav_4.png" alt=" Skullcandy Headphones" title=" Skullcandy Headphones" /> Skullcandy Headphones</a></li></ul>
¿Que clases debo de crear en mi style.css para que copie este mismo estilo?