-
页面局部闪烁主因是GPU合成层切换失败导致CPU渲染，常见于opacity/transform过渡，尤其Safari；应避免layout属性动画、合理创建合成层，并按设备UA适配。
-
Grid布局与Float共存时需隔离影响，避免在Grid项目中使用float，通过clear或BFC清除外部浮动，并采用渐进式迁移策略实现平滑过渡。
-
Fetch的cache参数决定浏览器如何复用缓存响应，而非禁用缓存；其值包括default（遵HTTP头）、no-store（不读不写）、reload（强制网络请求）、no-cache（先校验）、force-cache（优先用过期缓存）、only-if-cached（仅缓存，无则报错）。
-
HTML5实现元素转动动画有五种方法：一、CSS3transform配合@keyframes；二、JavaScript动态修改style.transform；三、CanvasAPI的save/rotate/restore；四、SVGtransform属性或SMIL动画；五、WebAnimationsAPI精确控制。
-
在CSS中设置外边距的主要方法有：1.使用单个margin属性，可以一次性设置四个方向的外边距；2.使用单独的属性如margin-top等，适用于精细控制；3.使用百分比和auto值，适用于响应式设计和居中元素。实战经验包括注意外边距塌陷、使用百分比或rem单位进行响应式设计、谨慎使用负外边距以及性能优化。
-
:hover时用transition平滑加深box-shadow需设基础阴影、显式声明transition，并调优blur-radius、offset-y和alpha值以增强纵深感，避免none起始值或overflow裁剪导致失效。
-
直接给容器设background-color并用object-fit:cover是最简解法，但需确保容器有明确宽高以避免加载闪白；cover裁边、contain留黑边，选择取决于业务对裁切或完整性的要求。
-
用多个语义中立的<span>分隔文本实现分页范围显示，JS动态更新各部分textContent，CSS用white-space:nowrap等确保对齐与断行，避免ARIA干扰。
-
fixed定位使元素脱离文档流并固定于视口，需显式设置top/right；sticky依赖可滚动祖先且受transform等影响；JS方案最可控但需节流和transform优化。
-
模板字符串用反引号包裹，天然支持多行、内嵌变量、保留原始格式，并支持标签函数。如第一行第二行、${name}、正则表达式及safeHtml<div>${userInput}</div>等。
-
雪碧图background-position需以元素左上角为原点，垂直堆叠时第二图标为0-16px；内联style限首屏小样式（≤1KB），禁用normalize等大文件；base64临界值建议设4096；preload必须加as="style"。
-
在ReactQuery中，应将动态参数（如token）作为hook的依赖项传入，而非通过refetch二次传参；需结合状态管理与enabled选项控制查询时机，确保参数存在时才发起请求。
-
移动端:active失效主因是浏览器未触发该状态，常见于缺失viewport声明、touchstart中误用preventDefault()、事件流被中断或样式继承不稳定；需结合JS状态管理增强反馈。
-
优酷收藏夹视频强制使用HTML5播放器且无法关闭，因自2021年起已全量下线Flash；可通过浏览器设置禁用自动播放，或排查网络、插件、MSE兼容性等问题解决加载异常。
-
HSL色相值需按色相环角度规范使用，推荐30°/45°/60°等分步长取值，辅色优先±30°或±60°；饱和度与明度须随色相联动调整，暖色降s提l，冷色可提s控l，中性色低s高l；CSS变量+calc()实现动态推演，注意色域差异与浏览器兼容性。
