CSS 環境変数

CSS 環境変数 (CSS environment variables) モジュールは、環境変数の概念と env() 関数を定義します。環境変数は、カスタムプロパティや var() 関数と同様に機能しますが、グローバルに定義される点が異なります。これらは文書全体にスコープを持つグローバル変数です。これらはブラウザーやオペレーティングシステムによって提供されるユーザーエージェント値であり、env() 関数を使用してアクセスできます。これにより、ユーザーの端末やコンテキストに合わせてスタイルを適応させることが可能になります。

環境変数は、ユーザーエージェントがアクセス可能な情報(タイトルバーのサイズ、動的キーボード、安全領域インセットなど)に基づいてページ上で使用できる値を提供します。安全領域インセットは、ビューポートの端からの距離に基づいて、矩形以外のディスプレイでも確実に表示される矩形領域を定義します。ユーザーエージェントのサイズをスタイルに組み込むことで、表示可能な動的キーボードの隣や、表示されているタイトルバーに隣接する安全領域矩形内の利用可能な空間に基づいて、重要なコンテンツのレイアウトを変更できるようになります。