:link クラス
:link クラスは、アンカーである <a> エレメントにおいて未訪問のリンクならば、設定されたスタイルを反映する擬似クラスです。
a:link {
background-color: blue;
}
詳しくは Example を参照してください
:link以外の似た疑似クラスに:visited、 :hover、 :activeがあります。
これらの疑似クラスにはユーザーに対する反応が想定されています。
:linkは未訪問、:visitedは訪問済み、:hoverはエレメントの上をマウスポインターがある状態、:activeはクリックされた状態です。
ユーザーに対する反応順として、:link —> :visited —> :hover —> :active と想定されており、
より右側の状態の設定が優先されます。:hoverの設定は:activeの設定で上書きされるということです。
ページ内 Index
構文(Syntax)
CSS
HTMLElement:link {
style_propaties;
}
DOM ( JavaScript )
疑似クラスはDOM ( JavaScript )から操作できません。
スタイルのみの操作は擬似クラスを利用したほうが簡易です。
JavaScriptからスタイルを設定することはできます。以下はその例です。
in HTML
<a id="example" href="#">リンク例です</a>
in JavaScript
document.getElementById("example").style.background="linear-gradient(transparent 70%, #8E8EFF 0%)";
Example
:linkの例です。未訪問のリンク :link は青色、訪問済みは灰色、hover 時は下線のみが赤色、:active 時は全体が赤色で表示されます。
backgroundプロパティに関しては:linkの設定が反映されるようです。