div{
width:500px;
height:600px;
resize:both; // 可拖动方向
overflow:hidden;
padding:15px;
background-color:red;
container-type:size; // 对
}
div p {
// cqw 表示根据container-type所选择的宽度作为参照，3cqw表示为500*0.03，
// cqh 表示根据container-type所选择的高度度作为参照，3cqh表示为500*0.03，
font-size:3cqw;
}
与媒体查询的区别：
媒体查询是查询不同设备，不同的屏幕大小来做的响应式处理。
容器查询时根据容器的不同大小来做响应式处理的，需要对被查询的容器设置container-type属性。
媒体查询依据的是浏览器的视窗大小，容器查询依据的是元素的父元素或者祖先元素的大小。
font-size 属性标志
cqw 表示选择参考容器的宽度作为参照，3cqw表示为 容器宽度0.03
cqh 表示选择参考容器的高度作为参照，3cqh表示为 容器宽度0.03
container-type属性
container-type:inline-size; 表示在inline内联轴的方向。
container-type:size; 表示根据宽和高方向进行查询