overflow-anchor

overflow-anchorCSS のプロパティで、コンテンツの移動を最小化するためにスクロール位置を調整する、ブラウザーのスクロールアンカリングの動作をオプトアウトする方法を提供します。

スクロールアンカリングの動作は、対応しているすべてのブラウザーで既定で有効になっています。したがって、このプロパティを変更するのは通常、文書または文書の一部でスクロールアンカリングによって操作上の問題が発生し、この動作をオフにする必要がある場合のみです。

構文

/* キーワード値 */
overflow-anchor: auto;
overflow-anchor: none;

/* グローバル値 */
overflow-anchor: inherit;
overflow-anchor: initial;
overflow-anchor: unset;

auto
その要素は、スクロール位置を調整するときにアンカー候補になります。
none
その要素はアンカー候補として選択されません。

形式文法

auto | none

文書内でスクロールアンカリングを抑止する場合は、 overflow-anchor プロパティを使用してください。

body {
  overflow-anchor: none;
}

仕様書

仕様書 状態 備考
CSS Scroll Anchoring Module Level 1
overflow-anchor の定義
編集者草案 初回定義
初期値auto
適用対象すべての要素
継承なし
メディア視覚
計算値指定値
アニメーションの種類個別
正規順序構文通り

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
overflow-anchor
実験的
Chrome 完全対応 56Edge 未対応 なしFirefox 完全対応 66IE 未対応 なしOpera 完全対応 43Safari 未対応 なしWebView Android 完全対応 56Chrome Android 完全対応 56Firefox Android 未対応 なしOpera Android 完全対応 43Safari iOS 未対応 なしSamsung Internet Android 未対応 なし

凡例

完全対応  
完全対応
未対応  
未対応
実験的。動作が変更される可能性があります。
実験的。動作が変更される可能性があります。

関連項目