Сделать так, что бы при нажатии кнопка менялась

Подскажите пожалуйста - как сделать так, что бы при нажатии на кнопку она менялась, при отпускании становилась прежней, и при том при всем она еще и при наведении менялась, т.е. в этом цикле используется 3 вида кнопок (картинок). Прошу привести примеры через css и без.

Как пример того, что я хочу визуально получить - это кнопка Яндекса "Найти" - наводишь на нее курсор - немного меняется, нажимаешь(но не отжимаешь) - меняется, убираешь курсор - становится прежней.

У меня в css вот такой код для того, что бы при наведении курсора картинка менялась, как в этот код добавить что бы и при нажатии(но не клике) еще картинка менялась?

input.wpsc_buy_button{

 background-image: url(images/buy_button.png);

 border: none;

 width: 124px;

 height: 50px;

 text-align: center;

/*  vertical-align: top; */

 padding: 0px 0px 0px 0px;

 font-size: 0pt;

 margin-top: 3px;

 color: #6a6c74;

 cursor: pointer

 }

  .wpsc_buy_button:hover {

    background: url(images/buy_button2.png); /* Путь к файлу с заменяемым рисунком  */

   }