オンマウスで文字を罫線で囲む
表示の例
テストページ1へ
テストページ2へ
テストページ3へ
リンク文字にマウスポインタをのせた時に、文字を囲む罫線が表示されます。
ソースは下のようになります。
HTMLソースのHEAD区間に貼り付けましょう。
(必ず一度メモ帳などに貼り付けてから、あなたのページのHTMLソースに貼り付けてください)
ソース
<STYLE type="text/css">
<!--
A:link {text-decoration:none}
A:visited {text-decoration:none}
A:active {text-decoration:none}
A:hover {border-width:1px;border-style:solid;border-color:#3366FF;padding:2}
-->
</STYLE>
A:hover {border-width:1px;border-style:solid;border-color:#3366FF;padding:2} の部分で、マウスポインタをのせた時の罫線の設定をしています。
下の表を見てあなたのお好みにかえてみましょう。
罫線の太さ border-width:1px; の 1
罫線の指定 border-style:solid の solid
罫線の種類 solid(実線) dotted(点線) dashed(点線)
罫線の色 border-color:#3366FF; の #3366FF
罫線内のスペース padding:2 の 2
ホームページお役立ち小技集のTOPへ