| リンクの装飾 （詳細情報） |
|---|
| 対応 |
Internet Explorer 6 ↑
Netscape 7 ↑ （ブラウザの対応）
|
| 字体 |
<style type="text/css">
<!--
a:link {★}
a:visited {★}
a:hover {★}
a:active {★}
-->
</style>
|
| 指定 |
★の部分に下記の太字の効果を指定していきます。
複数の効果を指定する場合は , で区切ってください。
- 「a:link」 まだ訪れていないリンク。
- 「a:visited」 一度訪れたことがあるリンク。
- 「a:hover」 カーソルがリンクの上にあるとき。
- 「a:active」 リンク先をクリックしたとき。
|
| 効果 |
リンク用の文字色や装飾を指定できます。 |
| 例１ |
a:link {color:#ff0000;} （リンクの色を指定） |
| 結果 |
サンプル用の文字 |
| 例２ |
a:link {background-color:#ffaaaa;} （リンクの背景色を指定） |
| 結果 |
サンプル用の文字 |
| 例３ |
a:link {text-decoration:none;} （リンクの下線を消す） |
| 結果 |
サンプル用の文字 |
| 例４ |
a:link {text-decoration:underline overline;} （リンクに上下線をつける） |
| 結果 |
サンプル用の文字 |
| 解説 |
a:hover の部分だけに背景色などを指定すると、リンク部分にマウスのカーソルが重なったときだけ背景色を表示したりできます。
|
