使用`position:fixed`实现右侧悬浮社交栏时，垂直居中必须配合`top:50%`与`transform:translateY(-50%)`。注意祖先元素的`transform`或`filter`会使定位基准偏移。主内容需手动设置`margin-right`预留空间，并在移动端隐藏侧边栏时同步归零。避免对``添加`padding-right`以防横

分享链接预览图显示异常常因og:image未被正确解析：需完整HTTPS绝对URL、尺寸≥1200×630像素、响应头含CORS许可、图片可公开访问。平台缓存需用Debugger刷新。Twitter需单独声明卡片标签。服务端渲染确保爬虫读到meta，本地调试需公网HTTPS地址。

使用createElementNS创建SVG元素时，对于标准属性（如x、y、stroke）必须始终使用setAttribute（不带命名空间）赋值，如果错误地使用了setAttributeNS，则这些属性将不会被SVG渲染引擎所解析，导致元素虽然可见但无法正常显示。此原则适用于所有SVG元素，无一例外。

基于用户选择的国家动态更新隐私政策链接，满足GDPR等不同辖区合规要求。推荐精简HTML结构，保留唯一ID的锚点，通过select的change事件用模板字符串拼接URL，option值使用标准国家代码。需注意国家代码与服务器路径严格对应及默认值初始化。

在ServiceNow知识库页面中，利用IntersectionObserverAPI检测不可见锚点位置，动态控制“返回顶部”按钮的显示与隐藏。当锚点滚动至视口上方时按钮淡入，锚点重新进入视口时按钮淡出，实现仅在用户向下滚动一定距离后出现、回到顶部自动隐藏的效果，避免按钮始终固定显示。

针对移动端视频全屏问题，需注意：消除视频黑边应使用fixed定位、100dvh和object-fit:cover；确保自动播放成功必须同时设置autoplay、muted、playsinline和preload；使z-index层级生效需配合定位属性并设置pointer-events:none；采用动态视口高度dvh单位可避免横竖屏切换时画面抖动。这些技巧可

SCSS中@mixin仅在调用时展开代码模板，重复输出源于反复调用大型@mixin。避免方法包括：将静态无参样式改用%placeholder以合并选择器，原子级@mixin封装单一逻辑单元，组合型@mixin只用于动态场景，并避免在循环中@include。

:placeholder-shown伪类检测浏览器是否渲染占位符文本，而非输入框内容是否为空。它作为状态开关，配合label元素实现悬浮效果：:placeholder-shown时标签沉底，:not(:placeholder-shown)时标签上浮。需注意选择器顺序、placeholder属性存在性及浏览器兼容性，单靠该伪类无法处理聚焦状态。