スタイルシートリファレンス > :link,:visited,:active,:hover

スタイルシートリファレンス :link,:visited,:active,:hover


:link,:visited,:active,:hover リンクに対しての定義済みクラス (IE4/N6)

リンクに対しての定義済みクラス。

a:link
未訪問リンク
a:visited
訪問済みリンク
a:active
クリックした時
a:hover
マウスオーバー時

text-decoration:none;とすることで下線のないリンクにすることができます。

▲ページ先頭へ

使用例 :link,:visited,:active,:hover

HTMLソース

<html>
<head>
<title>CSS テスト</title>
<style type="text/css">
<!--
a:link{
color:#ff0000;
text-decoration:underline;
}
a:visited{
color:#00ff00;
text-decoration:overline;
}
a:active{
color:#ffff00;
}
a:hover{
color:#00ffff;
text-decoration:line-through;
}
-->
</style>
</head>
<body>
<a href="index.html">スタイルシートリファレンス</a><br>
<a href="abc.html">スタイルシートリファレンス ABC順</a><br>
<a href="text-decoration.html">text-decoration</a><br>
</body>
</html>

▲ページ先頭へ

ブラウザ上の表示



▲ページ先頭へ

関連項目【擬似クラス】

:link
未訪問リンクに対してスタイルを指定する
:visited
訪問済みリンクに対してスタイルを指定する
:active
リンクをクリックした時のスタイルを指定する
:hover
リンクにカーソルを合わせている時のスタイルを指定する
:focus
要素にフォーカスを合わせている時のスタイルを指定する
:lang
要素の記述言語を指定する
!important
指定したスタイルを優先させる

▲ページ先頭へ

スタイルシートリファレンス > :link,:visited,:active,:hover