マウスを乗せるとテキストの色が変わる

• トップ
• How To
• マウスを乗せるとテキストの色が変わる

説明

スタイルシートの :hover を用いて、テキストにマウスを乗せた際に色を変更しています。他にも、フォントサイズを変更したり、下線をつけたり、いろいろなことが可能です。Internet Explorer 7.0以降で利用可能です。

実例

ソースコード

<style>
.hover-red:hover {
    color: red;
}
</style>
　:
<div class="hover-red">
このテキストの上にマウスを乗せてください。
</div>

動作確認

IE7.0(Win)で動作確認しています。