Widely available YES。主要ブラウザで広く対応済み。本番利用を推奨。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
65
79
50
9
65
9
not match link

`:any-link` プライバシー: セレクターが `<link>` 要素と一致しません

65
79
87
15
65
15
その他

`:リンク`

1
12
1
1
18
3.2
CSS セレクタ
not match link

`:link` プライバシー: セレクターが `<link>` 要素と一致しません

1
12
87
15
18
15
その他

`:訪問しました`

1
12
1
1
18
1
CSS セレクタ
not match link

`:visited` プライバシー: セレクターが `<link>` 要素と一致しません

1
12
87
15
18
15
privacy measures

プライバシーのために「:visited」を使用してステートメント内で許可される CSS プロパティを制限する

6
12
4
5
18
4.2
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 1件
対応条件
  • ベンダープレフィックス付きで対応: -webkit- (1)
注釈 1件
対応条件
  • ベンダープレフィックス付きで対応: -webkit- (79)
注釈 2件
削除済み
  • このバージョンで機能が削除されました (50)
対応条件
  • ベンダープレフィックス付きで対応: -moz- (1)
注釈 3件
対応条件
  • ベンダープレフィックス付きで対応: -webkit- (3)
  • ベンダープレフィックス付きで対応: -khtml- (1.2)
削除済み
  • このバージョンで機能が削除されました (3)
注釈 1件
対応条件
  • ベンダープレフィックス付きで対応: -webkit- (18)
注釈 1件
対応条件
  • ベンダープレフィックス付きで対応: -webkit- (1)

基本構文

CSS
:any-link {
  color: #0066cc;
}
:visited {
  color: #551a8b;
}
:link {
  text-decoration: underline;
}

ライブデモ

:any-link

CSS:any-link demo.

プレビュー全画面表示

:link And:visited

CSS:link and:visited demo.

プレビュー全画面表示

link. decoration

CSS link. decoration demo.

プレビュー全画面表示

実務での使いどころ

  • リンクの訪問状態別スタイリング

    未訪問リンクと訪問済みリンクに異なる色を適用し、ユーザーがどのページを既に閲覧したかを視覚的に示します。

注意点

  • :visitedではプライバシー保護のためcolor等の限られたプロパティのみ変更可能です。background-imageやborderなどは変更できません。

アクセシビリティ

  • リンクの色は周囲のテキストと十分なコントラスト差を持たせ、色以外の手段(下線など)でもリンクを識別できるようにしてください。