-
display:flex能绕过幽灵空白，因其切换至弹性盒格式化上下文，子元素作为flexitem被处理，源码中换行符、空格等空白字符被完全忽略，不进入行内格式化上下文（IFC），故从根源上不触发幽灵空白。
-
matches()是浏览器原生CSS引擎驱动的精准匹配方法，自动忽略class顺序、重复、空格及动态变更，支持复合选择器，语义准确且无副作用，兼容性可控。
-
z-index没效果最常见原因是父容器创建了层叠上下文，导致子元素z-index只在该上下文中生效；它仅对position为relative、absolute、fixed或sticky的元素有效，且比较基于层叠上下文而非全局数值。
-
light-dark()是CSS原生函数，非HTML功能，仅在支持浏览器（Chrome121+、Safari17.4+、Firefox125+）的CSS规则中生效，用于根据系统偏好自动切换颜色，不可用于内联样式或JS直接调用。
-
多层box-shadow应采用偏移为0、模糊半径递增、透明度递减的组合：第一层02px4pxrgba(0,0,0,0.1)，第二层04px12pxrgba(0,0,0,0.08)，第三层08px24pxrgba(0,0,0,0.05)。
-
JavaScript中大数组切片被闭包长期持有会导致底层ArrayBuffer无法释放，引发内存膨胀；需通过DominatorTree定位RetainedSize异常的ArrayBuffer，检查闭包引用链并切断视图型引用。
-
正确使用word-break属性可避免单词被截断：优先选用normal或keep-all值，确保英文单词在空格处换行；搭配white-space:normal和固定宽度容器，提升文本可读性。
-
overscroll-behavior用于切断嵌套滚动容器间的事件传递链，仅在可滚动容器（overflow非visible且内容溢出）滚动至边界时生效；典型场景为模态框或侧边栏滚动到底/顶时阻止背景页面滚动。
-
Temporal.Duration无法处理夏令时，必须配合Temporal.ZonedDateTime使用；因Duration是纯线性运算、不感知时区，而ZonedDateTime调用add()时会查IANA数据库自动应用DST偏移。
-
--scale变量配合calc()控制尺寸比transform:scale()更可靠，因它改变布局盒而非仅渲染层，避免点击区域错位、坐标系失准、字体糊化等问题。
-
font-variant-numeric:tabular-nums仅使数字等宽，不控制对齐；需配合text-align、支持等宽数字的字体及table-layout:fixed等设置才能实现表格中数字精准对齐。
-
autoplay必须与muted配合才生效，controls控制原生控件显示，muted影响初始音量，preload仅为提示，loop在iOS全屏下需playsinline才有效。
-
Symbol.for()与Symbol.keyFor()在跨模块中能真正共享符号的前提是键名字符串完全一致且运行于同一全局符号注册表；通过===比对不同模块中Symbol.for('x')结果及Symbol.keyFor()返回非undefined可验证共享成功。
-
Bootstrap导航栏用transform+transition隐藏失效，主因是未设fixed/absolute定位；应添加fixed-top类、避免overflow:hidden，并仅对.navbar根元素加transform动画，配合JS切换.hidden类实现平滑滑入滑出。
-
width:max-content并非万能，仅在display:inline-block或table时生效，Firefox严格按内容计算，Chrome可能忽略内联换行；fit-content更稳妥，兼容性好且对flex/grid有效，IE需fallback为inline-block+white-space:nowrap。
