-
本文详解如何修复因相对定位偏移导致的下拉菜单错位问题，通过统一采用position:relative+top/left:0基准布局，并结合Flexbox对齐与层级管理，实现类似《Cyberpunk2077》官网风格的响应式、像素级可控导航栏。
-
clip-path动画不能直接用transition，因为浏览器仅对同构路径（如顶点数、类型、顺序均一致的polygon）进行线性插值；混用circle()与polygon()或单位不统一会导致跳变或失效。
-
IE8及更早版本不解析rgba()，需用filter:alpha(opacity=XX)或gradient滤镜降级，且fallback必须前置、块级元素、十六进制颜色匹配，否则背景消失或子元素异常变淡。
-
Bootstrap5浮动标签依赖:placeholder-shown伪类与input+label相邻选择器，label必须在input后且input必须有placeholder属性（含placeholder=""），否则浮动失效。
-
BEM是通过命名强制解耦样式与DOM结构的协作规范。它用Block-Element-Modifier三层语义类名替代深层后代选择器，避免结构变动导致样式失效，提升可维护性、复用性与工程健壮性。
-
CSRF防护需服务端动态生成、安全传输并严格校验；Token须绑定session、禁复用、禁硬编码，前端须从DOM安全提取并手动携带至AJAX请求头或表单字段。
-
coords属性单位仅为像素，需按图像原始尺寸设定，不支持CSS单位或负数；shape决定coords格式：rect为“x1,y1,x2,y2”，circle为“x,y,r”，poly为“x1,y1,x2,y2,...”；错位常因CSS缩放未换算坐标或usemap不匹配导致。
-
box-shadow本身不响应系统主题切换，需通过:root中定义带透明度的CSS变量，并在@media(prefers-color-scheme:dark)或[data-theme="dark"]中重设变量值来实现主题适配；关键在于只抽离颜色部分、使用rgba/hsla、提供fallback、避免整条阴影塞入变量。
-
background-clip:text不生效主因是未设color:transparent；仅WebKit内核原生支持，Firefox需加-webkit前缀及-webkit-text-fill-color:transparent；推荐分层封装SCSS混合宏，base处理透明与clip，上层组合渐变；禁用text-stroke与background-clip同用；iOS15.4前需JS特性检测降级。
-
let和const替代var是最值得立刻改写的改动，它们修正了var的变量提升、函数作用域模糊和重复声明等根本缺陷，强制块级作用域并消除静默bug。
-
align-items动画不平滑是因为它不触发GPU加速，每次变化都引发layout→paint→composite全流程；而transform（如translateY）可硬件加速，提升为独立图层，实现60fps平滑动画。
-
white-space:nowrap是最直接有效的禁止自动换行方式，但需配合width/max-width、display:block/inline-block、overflow:hidden及text-overflow:ellipsis才能实现完整截断效果，且在表格、contenteditable等场景需额外处理。
-
BigInt内存开销不固定，取决于数值大小和引擎实现；Float64固定8字节、对齐可预测。高算力场景需关注分配、对齐、缓存与传输，而非单值字节数。
-
referrerPolicy属性名必须严格小写，首字母小写、P大写、其余小写；拼写错误（如referrerpolicy）会被浏览器忽略，退化为默认策略；fetch的referrerPolicy选项同理，且服务端Referrer-Policy响应头优先级更高。
-
点击切换灰度效果需JS控制状态：监听click事件，用dataset记录当前灰度状态并直接设置style.filter，配合transition实现平滑动画，注意兼容Safari前缀、避免内联样式覆盖及图片加载完成后再绑定事件。
