【CSS Modules】:link疑似クラスの使い方
:link疑似クラスの使い方について、初心者にもわかりやすく解説します。
作成日: 更新日:
基本的な使い方
:link擬似クラスは、CSSにおいて、まだユーザーによって訪問されていない状態のリンク（<a>要素）を選択するために使用されるセレクタです。ウェブページ上でユーザーが一度もクリックしていないリンクに対して、特定のスタイルを適用したい場合に利用します。例えば、未訪問リンクの文字色を青に設定したり、下線をつけたりすることができます。
この擬似クラスは、リンク要素が持つURLを参照し、ブラウザの閲覧履歴と比較することで、そのリンクが「未訪問」であるかを判断します。訪問済みのリンクに対しては、:visited擬似クラスが使用され、異なるスタイルを適用することが可能です。:linkは通常、href属性を持つ<a>要素にのみ適用され、その他の要素には効果がありません。
:linkを適切に活用することで、サイト訪問者がどの情報をまだ見ていないかを視覚的に区別できるようになり、ウェブサイトのユーザビリティ向上に貢献します。:hoverや:activeなどの他の擬似クラスと組み合わせて使用することも可能ですが、セレクタの特異性を考慮して記述する必要があります。これにより、ユーザーの行動に基づいた動的なスタイリングを実現し、より直感的で使いやすいウェブ体験を提供できます。
公式リファレンス: :link
構文(syntax)
1a:link { 2 color: blue; 3}
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません