CSS 容器查询速查

查询 CSS 容器查询（Container Queries）相关的语法与示例，包括 container-type、container-name、@container、inline-size、size 以及容器相对单位 cqw、cqh、cqi 等。它让组件能根据自身容器尺寸自适应，而不仅依赖视口。全部在浏览器本地完成。

关键字查询等待输入

输入容器查询关键字，例如 @container、container-type、cqw。

计算结果

收录条目—

当前结果—

输入关键字后点击查询，结果将显示在这里。

语法依据 CSS 规范整理；结果仅供参考。

计算说明

container-type 用于把元素声明为查询容器。
inline-size 按宽度建立容器，最常见。
@container 按容器尺寸应用样式，而非视口。
cqw、cqh、cqi 等是相对容器的长度单位。
容器查询让组件在不同布局位置自适应，提升复用性。