HTML Living Standard/anchor属性
anchor属性
[編集]anchor属性は、要素を特定のスクロール位置や固定位置に関連付けるために使用される属性です。この属性は現在実験的な機能であり、一部のブラウザでのみサポートされています。そのため、実際のプロジェクトで使用する際は注意が必要です。
基本構文
[編集]<element anchor="selector"></element>
anchor属性では、スクロール位置や固定位置を基準に関連付ける要素を指定します。指定する値はCSSセレクター形式です。
使用例
[編集]以下に、anchor属性を使用した具体的な例を示します。
<div id="target" style="position: fixed;">この要素は基準になります</div> <div anchor="#target"> この要素は <code>#target</code> に関連付けられています。 </div>
この例では、anchor属性によって2番目の要素が#targetに関連付けられ、スクロールやレイアウトの挙動が影響を受けます。
注意点
[編集]anchor属性は現在実験的な状態であり、すべてのブラウザで動作するわけではありません。- 使用する際には、最新のブラウザ対応状況を確認してください。
- 実験的な機能であるため、将来的に仕様が変更される可能性があります。
対応ブラウザ
[編集]anchor属性のサポート状況は以下の通りです（2025年1月執筆時点での情報）。
- 対応ブラウザ: 一部の最新ブラウザ（例: Chromium系ブラウザのベータ版）
- 非対応ブラウザ: Safari、Firefox（将来的に対応予定の場合あり）
参考情報
[編集]- 実験的な機能を利用する場合は、MDN Web Docsなどのドキュメントを参照し、フォールバック処理を含めた実装を行うことを推奨します。