Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【CSS Modules】:visited疑似クラスの使い方

:visited疑似クラスの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

:visitedクラスは、ウェブサイト上でユーザーがすでに訪れたことのあるリンクを表す疑似クラスです。これは、ユーザーが以前にアクセスしたことのあるURLへのリンクに、特定のスタイルを適用するために使用されます。これにより、ユーザーはどのリンクを既にクリックしたかを一目で認識でき、ウェブサイトのナビゲーション体験が向上します。

主にHTMLの<a>(アンカー)要素に適用され、そのhref属性で指定されたURLへの訪問履歴に基づいてスタイルが変化します。しかし、プライバシーとセキュリティの観点から、この疑似クラスに適用できるCSSプロパティは厳しく制限されています。悪意のあるウェブサイトがユーザーの閲覧履歴を不正に取得することを防ぐため、colorbackground-colorborder-coloroutline-color、およびSVGのfillstrokeプロパティのみがスタイル変更可能です。これら以外のプロパティは、通常の未訪問リンク(:link)と同じ値として扱われます。この制限は、ユーザーのプライバシー保護を目的とした重要な措置であり、ウェブ開発者はこの制約を理解した上でスタイルを設計する必要があります。

公式リファレンス: :visited

構文(syntax)

1a:visited {
2  color: purple;
3}

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ