İnput içindeki resmi css spite yapmak

[YEŞİL AŞKI]

Sitemizde böyle bir kod var.
HTML Kodu:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
Bunun yerine şu şekilde bir css sprite ayarlanmış kod yazınca herşey güzel çalışıyor.
HTML Kodu:
<div class="sprites" id="sprite-smiley"></div>
Peki kod input içinde olunca bunu nasıl yapacağım
HTML Kodu:
<input class="button" height="24" width="24" type="image" src="<?php bloginfo('template_url'); ?>/images/giris.png" name="submit" value="<?php _e('Login'); ?> &raquo;" title="Oturum Aç" />

 

[YEŞİL AŞKI]

O zaman şöyle sorayım. Kullanıcı girişi kodumun "Giriş" butonu kısmı

Mevcut Kod:

<input class="button" height="24" width="24" type="image" src="http://www.yesilaski.com/giris.png" name="submit" value="<?php _e('Login'); ?> &raquo;" title="Giriş" />

Şu hale nasıl getirebilirim.

<a href="............" target="_self" title="Giriş"><img src="http://www.yesilaski.com/giris.png" alt="Giriş" height="24" width="24"></a>