CSS - container-type
概要
| 属性名 | container-type |
|---|---|
| 値 | normal | [ [ size | inline-size ] || scroll-state ] |
| 初期値 | normal |
| 適用可能要素 | すべての要素 |
| 継承 | 継承しない |
| サポート | https://caniuse.com/?search=container-type |
説明
コンテナクエリのタイプを指定します。詳細は「コンテナクエリ」を参照してください。
- normal
- 通常時の動作となります。
- size
- インライン方向(通常は横方向)とブロック方向(通常は縦方向)のサイズに応じて異なるスタイルを適用します。
- inline-size
- インライン方向(通常は横方向)のサイズに応じて異なるスタイルを適用します。
- scroll-state
- スクロール状態に応じて異なるスタイルを適用します。Chrome 133 でサポートされました。(サポート状況)
リンク
- https://drafts.csswg.org/css-conditional-5/#container-type
- https://developer.mozilla.org/ja/docs/Web/CSS/container-type
- https://caniuse.com/?search=container-type
Copyright (C) 2023-2025 杜甫々
初版：2023年2月19日、最終更新：2025年3月2日
https://www.tohoho-web.com/css/prop/container-type.htm