Explanation
Use (a tag) :hover to change images on mouseover. You must use the <a> tag in order to make this process in Internet Explorer but other browsers (Firefox, Opera, Safari etc) allow you to set different tags and classes. Specify displayed images using the background-image selector to change images on mouseover. There is another way to show as if images were changed by displacing their display position.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>Sample</title>
<style type="text/css"><!--
.testBtn {
background-image:url(btn1.jpg);
width:64px;
height:32px;
}
.testBtn:hover {
background-image:url(btn2.jpg);
width:64px;
height:32px;
}
--></style>
</head>
<body>
<h1>Sample</h1>
<p>
Change images on mouseover using CSS<br>
<div class="testBtn"></div>
</p>
</body>
</html>