コンテナクエリは、ビューポート全体ではなく、個々の要素(コンテナ)の寸法に基づいてレイアウト決定を可能にすることにより、Webデザインに革命を起こす態勢が整っています。幅600pxの行レイアウトを採用するコンテナを想像してください。ただし、幅の狭い幅で列レイアウトに切り替えます。このレベルの粒状制御は変換されます。これは、画面サイズのブレークポイントのみに依存する従来のレスポンシブデザインとは大きく異なります。
パーセンテージユニット(%)はコンテナ相関のサイジングを提供しますが、その機能は限られています。たとえば、コンテナの幅は親の幅の一部として設定できますが、プロパティをリンクするメカニズムはありません。たとえば、コンテナの幅の一部としてフォントサイズを設定することはできません。
コンテナユニットを入力してください!提案された仕様では、いくつかの新しいユニットが紹介されます。
これにより、前例のない柔軟性が解除されます。フォントサイズ、ラインの高さ、ギャップ、マージン - 事実上すべてのプロパティ - は、コンテナの幅に基づいて動的に調整できるようになりました。
早期アクセスが利用可能です! Miriam(@terriblemia)は、Chrome Canaryのサポートを強調しています(コンテナクエリフラグを有効にして)。簡単なデモのビデオでは、可能性を紹介します。
スコットによるさらなる調査(スコットの作品へのリンクは、提供されればここに挿入されます)とアフマドシェードは追加の洞察を提供します。
Ahmad Shadeedは、コンポーネント内のフォントサイズ、パディング、およびマージンを管理するためのコンテナユニットの効率向上を強調し、手動調整の必要性を排除します。
コンテナクエリとコンテナユニットの同時放出は不確実なままですが、潜在的な影響は否定できません。
以上がコンテナユニットはかなり便利なはずですの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。