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

:target

:target 擬似クラスはURLのハッシュフラグメント（#section1 など）と一致するIDを持つ要素を選択します。ページ内リンクでナビゲートされた要素をハイライトしたり、JavaScriptなしでタブやアコーディオンを実装できます。SPAやアンカーリンクを多用するサイトで特に有用です。

擬似クラスURLフラグメント

概要

:target 擬似クラスはURLのハッシュフラグメント（#section1 など）と一致するIDを持つ要素を選択します。ページ内リンクでナビゲートされた要素をハイライトしたり、JavaScriptなしでタブやアコーディオンを実装できます。SPAやアンカーリンクを多用するサイトで特に有用です。

対応ブラウザ

デスクトップ

Chrome 1+
Edge 12+
Safari 1.3+
Firefox 1+

モバイル

Chrome Android 18+
Safari iOS 2+
Firefox Android 4+

基本構文

CSS 
:target {
  background-color: #ffffcc;
  border-left: 4px solid #f39c12;
  padding-left: 8px;
}

実務での使いどころ

  • アンカーリンク先のハイライト

    ページ内リンクでジャンプした先のセクションを視覚的にハイライトし、ユーザーに現在位置を示します。

注意点

  • URLフラグメントが変わるたびに :target の対象も変わるため、同時に複数の要素をターゲットにすることはできません。

アクセシビリティ

  • :target によるスタイル変更だけでなく、scroll-margin-top を設定して固定ヘッダーの下に要素が隠れないようにしてください。

参考リンク