diff options
author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2021-10-24 01:49:08 +0900 |
---|---|---|
committer | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2021-11-01 00:31:43 +0900 |
commit | cd010dda140dbc3cc6aef4d130a8b79d84c5ee00 (patch) | |
tree | f06ac42dc1c4af7cd9960f4ad0b31bc7bafac002 /files/ja/web/css/overflow-anchor/index.md | |
parent | 86e10636a81fa44329cb2ee5253e5a79859ffadd (diff) | |
download | translated-content-cd010dda140dbc3cc6aef4d130a8b79d84c5ee00.tar.gz translated-content-cd010dda140dbc3cc6aef4d130a8b79d84c5ee00.tar.bz2 translated-content-cd010dda140dbc3cc6aef4d130a8b79d84c5ee00.zip |
Web/CSS/overflow-anchor 以下を修正
- 2021/10/24 時点の英語版に同期
Diffstat (limited to 'files/ja/web/css/overflow-anchor/index.md')
-rw-r--r-- | files/ja/web/css/overflow-anchor/index.md | 85 |
1 files changed, 34 insertions, 51 deletions
diff --git a/files/ja/web/css/overflow-anchor/index.md b/files/ja/web/css/overflow-anchor/index.md index f1f0efaf23..bc931c6275 100644 --- a/files/ja/web/css/overflow-anchor/index.md +++ b/files/ja/web/css/overflow-anchor/index.md @@ -3,85 +3,68 @@ title: overflow-anchor slug: Web/CSS/overflow-anchor tags: - CSS - - CSS Property - - CSS Scroll Anchoring - - CSS スクロールアンカリング - CSS プロパティ + - CSS スクロールアンカリング - Reference - - overflow-anchor - - スクロールアンカリング + - recipe:css-property +browser-compat: css.properties.overflow-anchor translation_of: Web/CSS/overflow-anchor --- -<div>{{CSSRef}}</div> +{{CSSRef}} -<p><strong><code>overflow-anchor</code></strong> は <a href="/ja/docs/Web/CSS">CSS</a> のプロパティで、コンテンツの移動を最小化するためにスクロール位置を調整する、ブラウザーのスクロールアンカリングの動作をオプトアウトする方法を提供します。</p> +**`overflow-anchor`** は [CSS](/ja/docs/Web/CSS) のプロパティで、コンテンツの移動を最小化するためにスクロール位置を調整する、ブラウザーのスクロールアンカリングの動作をオプトアウトする方法を提供します。 -<p>スクロールアンカリングの動作は、対応しているすべてのブラウザーで既定で有効になっています。したがって、このプロパティを変更するのは通常、文書または文書の一部でスクロールアンカリングによって操作上の問題が発生し、この動作をオフにする必要がある場合のみです。</p> +スクロールアンカリングの動作は、対応しているすべてのブラウザーで既定で有効になっています。したがって、このプロパティを変更するのは通常、文書または文書の一部でスクロールアンカリングによって操作上の問題が発生し、この動作をオフにする必要がある場合のみです。 -<h2 id="Syntax" name="Syntax">構文</h2> +## 構文 -<pre class="brush:css no-line-numbers">/* キーワード値 */ +```css +/* キーワード値 */ overflow-anchor: auto; overflow-anchor: none; /* グローバル値 */ overflow-anchor: inherit; overflow-anchor: initial; +overflow-anchor: revert; overflow-anchor: unset; -</pre> +``` + +### 値 + +- `auto` + - : その要素は、スクロール位置を調整するときにアンカー候補になります。 +- `none` + - : その要素はアンカー候補として選択されません。 -<h3 id="Values" name="Values">値</h3> +## 公式定義 -<dl> - <dt><code>auto</code></dt> - <dd>その要素は、スクロール位置を調整するときにアンカー候補になります。</dd> - <dt><code>none</code></dt> - <dd>その要素はアンカー候補として選択されません。</dd> -</dl> +{{cssinfo}} -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> +## 形式文法 {{csssyntax}} -<h2 id="Example" name="Example">例</h2> +## 例 -<p>文書内でスクロールアンカリングを抑止する場合は、 <code>overflow-anchor</code> プロパティを使用してください。</p> +### スクロールアンカリングを抑止 -<pre class="brush: css">body { +文書内でスクロールアンカリングを抑止する場合は、 `overflow-anchor` プロパティを使用してください。 + +```css +* { overflow-anchor: none; } -</pre> - -<ul> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> +``` -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS Scroll Anchoring', '#propdef-overflow-anchor', 'overflow-anchor')}}</td> - <td>{{Spec2('CSS Scroll Anchoring')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> +## 仕様書 -<p>{{cssinfo}}</p> +{{Specifications}} -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> +## ブラウザーの互換性 -<p>{{Compat("css.properties.overflow-anchor")}}</p> +{{Compat}} -<h2 id="See_also" name="See_also">関連項目</h2> +## 関連情報 -<ul> - <li><a href="/ja/docs/Web/CSS/overflow-anchor/Guide_to_scroll_anchoring">スクロールアンカリングの</a>紹介</li> -</ul> +- [スクロールアンカリングの紹介](/ja/docs/Web/CSS/overflow-anchor/Guide_to_scroll_anchoring) |