動的ビューポート単位ジェネレーターとは
動的ビューポート単位ジェネレーターは、フォールバック付きの動的ビューポート単位(dvh, svh, lvh)を使用したCSSを生成します。 出力は公開サイトに使う前に確認しやすい形で表示されます。
Quick answer
Use dynamic viewport units (dvh, svh, lvh) for layouts that need to fill the mobile viewport correctly when the browser UI expands and retracts. Always include a classic vh fallback for older browsers.
Limitations
- Dynamic viewport units are only relevant on mobile browsers where the address bar and other UI elements expand and retract. On desktop, dvh, svh, and lvh behave identically to vh.
- Some browsers update dvh on scroll end rather than continuously, which may cause a visible jump in element height as the address bar retracts.
使い方
- 必要な値を入力します。
- 結果パネルの出力を確認します。
- ページに合う部分だけコピーします。
- 公開前にブラウザとホスティング環境で確認します。
主な用途
- 公開前の繰り返し作業を短くする。
- マークアップ、CSS、チェックリストを準備する。
- 静的サイトで見落としやすい小さなミスを減らす。