visibilityで画像置換する

html

qiita.html

<div class="btn">
    <a href="#">
        <img src="btn_off.gif" width="110" height="50" alt="ボタン" />
    </a>
</div>

css

qiita.css

.btn a {
  display: block;
  width: 110px;
  height: 50px;
}

.btn a:hover {
  background: url(btn_on.gif) no-repeat;
}

.btn a:hover img {
  visibility: hidden;
}