CSS鼠标移动到我的连接图片的时候更换另一张图片

写了个例子:

<a href="#"><img src="http://img.baidu.com/img/logo-zhidao.gif" border="0" onMouseOver="this.src='http://www.google.cn/intl/zh-CN/images/logo_cn.gif'" onMouseOut="this.src='http://img.baidu.com/img/logo-zhidao.gif'" /></a> 

给img标签加个属性:border="0"后,就不会有边框了 
图片的高度和宽度可以不用设定,只是设置了鼠标的两种状态,切换的其实是图片的地址src;
把样式提出来：
className

 <input id="btnLoging" type="button"  class="loginBtn_hover" onmouseover="this.className='loginBtn'" onmouseout="this.className='loginBtn_hover'" />

.loginBtn{width:88px; height:28px;background:url(../images/loginImage/loginbtn.png) no-repeat; border:none; border-width:0;}
.loginBtn_hover{width:88px; height:28px;background:url(../images/loginImage/loginbtn_hover.png) no-repeat;  border:none; border-width:0;}