viewport-fit
草案
このページは完成していません。
Experimental
これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
CSS の viewport-fit @viewport 記述子は、文書のビューポートが画面をどのように埋めるかを制御します。
構文
/* キーワード値 */
viewport-fit: auto;
viewport-fit: contain;
viewport-fit: cover;
値
auto- この値は初期状態のレイアウトビューポートに影響せず、ウェブページ全体が見えます。
contain- ビューポートは、画面内に内接する最も大きな長方形に合うように拡大縮小されます。
cover- ビューポートは、端末の画面の埋め尽くすように拡大縮小されます。これは重要なコンテンツが画面の外に出ないことを保証するために、安全領域差し込み変数を使用するために強く推奨されます。
形式文法
auto | contain | cover
アクセシビリティの考慮事項
viewport-fit 記述子を使用するとき、すべての端末の画面が長方形であるとは限らなないので、安全領域差し込み変数を使用してください。
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| CSS Round Display Level 1 "viewport-fit" descriptor の定義 |
草案 | 初回定義 |
ブラウザーの互換性
No compatibility data found for css.at-rules.viewport.viewport-fit.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.