必要な素材は、画像1枚だけ。

このように、上下分割された画像を1つ用意して下さい。
下半分が通常表示。 上半分がリンクhover状態になったときの画像です。
サイズ等は、何でも構いません。
例の画像では、横幅は91px、高さは50pxの画像を使っています。
画像URLは、http://xn--tfr729j.biz/img_hover/ewei.gifです。
こんな画像リンク↓これを作るためのソースを作るツールを御紹介します。
このように、マウスが上にのると画像が切り替るCSSを作り出してくれるWEBツールです。

このように、上下分割された画像を1つ用意して下さい。
下半分が通常表示。 上半分がリンクhover状態になったときの画像です。
サイズ等は、何でも構いません。
例の画像では、横幅は91px、高さは50pxの画像を使っています。
画像URLは、http://xn--tfr729j.biz/img_hover/ewei.gifです。
ご用意して頂きました画像のURLと、画像の横幅と高さを入力し、「作成するボタン」をクリックして頂きます。
「作成するボタン」をクリックすると、リンクhoverで画像が入れ替わるソースを表示します。