:target-current
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
:target-current は CSS の擬似クラス で、アクティブなスクロールマーカー、つまり、現在スクロールされている ::scroll-marker 擬似要素の scroll-marker-group を選択します。このセレクターは、スクロールマーカーグループ内のアクティブなナビゲーションの位置のスタイル設定に使用できます。
メモ: :target-current 擬似クラスは、 ::scroll-marker 擬似要素でのみ有効です。
構文
css
:target-current { /* ... */ } 例
CSS によるカルーセルの作成 および ::scroll-marker に、 :target-current 擬似クラスの完全な使用例があります。
基本的な使用
css
::scroll-marker { background-color: white; } ::scroll-marker:target-current { background-color: black; } 仕様書
| Specification |
|---|
| CSS Overflow Module Level 5 # active-scroll-marker |
ブラウザーの互換性
関連情報
scroll-marker-group::scroll-marker::scroll-marker-group- CSS によるカルーセルの作成
- CSS オーバーフローモジュール
- CSS Carousel Gallery (chrome.dev, 2025)