css部分：
.btn {background:url(bg1.jpg)}
.btn:hover {background:url(bg2.jpg)}
html部分就很简单了，给input加个样式就行
<input class="btn" type="submit" value="我是按钮" />
使用这个样式时别忘了先把input的默认样式，那些padding、margin、border什么的都清零，然后再定义一下宽高，这样出来的视觉效果会好些。
<img src="1.jpg" width="100" height="100" alt="" onclick="pf(this)"/><script type="text/javascript">
var arr = ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg"]
function pf(t) {
t.src = arr[Math.floor(Math.random()*arr.length)]
}
script>
<!DOCTYPE html><html>
<head>
<style>
#btn{background:red}
#btn:hover{background:blue}
</style>
</head>
<body>
<input id="btn" type="button"/>
</body>
</html>
经验证是可以的，或许是你的图片路径不对，不过ie6不支持伪类：hover属性，所以如果要兼容ie6就用js或者，用a标签来代替吧
