| ポイント |
<![CDATA[
a:hover { color:green; }
]]>
|
| 説 明 |
マウスがリンク文字上に乗ったら上線を表示するには:hover擬似プロパティとtext-decorationプロパティを使います。スタイルの定義部分でa:hover { text-decoration:overline; }のようにします。また、最初に下線を表示しないようにa { text-decoration:none; }も定義しておきます。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>マウスがリンク文字上に乗ったら上線を表示する</title>
<style type="text/css"><!--
a { text-decoration:none; }
a:hover { text-decoration:overline; }
--></style>
</head>
<body>
<a href="http://www.google.com/">Google</a><br>
<a href="http://www.yahoo.co.jp">Yahoo</a><br>
<a href="http://www.openspc2.org">OpenSpace</a><br>
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルを実行する >>実行
■各ブラウザでの動作結果を見る >>View! |
マウスがリンク文字上に乗ったら上線を表示する