二、CLS常见成因与排查方法

动态注入的内容 （如字体加载引起的文字重排、异步加载的推荐模块）在已有元素下方插入，推动后续内容下移

同时，可以在 @font-face 中设定 size-adjust 属性，让后备字体与目标字体的度量更接近，减少切换时🔥的重排幅度

对于大量图片的页面（如列表页、文章页🎯），可考虑使用懒加载时也一并设✨置占位容器高度，不要在图片进入视口才分配空间

黄添圣

轮播图 、 弹窗 等交互组件在页面渲染后才出现，并且没有预留位置

步骤三：优化Web字体加载策略 建议在CSS中使用 font-display: swap 配合 font-display: optional 的降级方案

一、什么是CLS以及为何要针对百度搜索进行优化

百度搜索引擎已将CLS纳入网站质量评价体系，较大的布局偏移会降低页面的搜索排名权重，📌因此专项修复CLS问题💡是提升百度收录与排名的关键环节之一

二、CLS常见成因与排查方法 要修复CLS，首先需要找到偏移的源头