楽天RMSオンマウスでテキストリンクに下線を出してみよう（HTML編）

楽天RMSでネットショップを作成していると、サイトのデザイン的にテキストリンクの下線（アンダーライン）が、ここは必要ないなーとか気になったことありませんか？

今回は、オンマウスの時だけ下線が表示されるパターンと表示しないパターンをHTML編でご紹介します。

では早速、HTMLの編集でCSS（スタイルシート）を適用して、カーソルがテキストリンクに乗った時だけ、下線（アンダーライン）を表示する書き方と表示しないソースの描き方を実装してみよう。

オンマウスでテキストリンクに下線を出す方法

次のソースを、記述することでオンマウスの時だけ下線が表示されるようになります。

<style type="text/css">
<!--
a { text-decoration:none; }
a:hover { text-decoration:underline; }
-->
</style>

オンマウスでテキストリンクに下線を表示させない方法

逆にオンマウス時に下線（アンダーライン）を表示したくない場合には、

a:hover { text-decoration:underline; }の
underlineのところを
noneに変更しましょう。

<style type="text/css">
<!--
a { text-decoration:none; }
a:hover { text-decoration:none; }
-->
</style>