容器查询的思路
传统自适应依赖 @media 查询设备宽度,而 CNEBLOG 改用 @container 查询容器宽度。
桌面端
当卡片容器宽度大于 768px,文章网格显示 4 列,目录以侧边栏常驻。
手机端
当容器宽度小于等于 768px,文章网格变为 2 列,目录收起为抽屉。
传统自适应依赖 @media 查询设备宽度,而 CNEBLOG 改用 @container 查询容器宽度。
当卡片容器宽度大于 768px,文章网格显示 4 列,目录以侧边栏常驻。
当容器宽度小于等于 768px,文章网格变为 2 列,目录收起为抽屉。