-
CSS变量+HSL组合切换主题色的底层逻辑是用:root定义可被JS动态修改的HSL变量，通过层叠实现全局响应；HSL仅调h值即可换主色且保协调，RGB易致对比崩坏。
-
MutationObserver需target（已挂载DOM节点）、options（至少一个true）和observe()三者齐全才触发；监听父容器+subtree、及时disconnect、注意microtask时机。
-
圣杯布局现在不用float，因flex和grid原生支持多栏流式、等高、自适应，代码更简、调试更易；float实现需手动清浮动、负margin、padding预留等复杂操作，易错且维护难。
-
mix-blend-mode仅对非隔离且同层叠上下文的兄弟或后代元素生效；父元素设isolation:isolate、transform、filter或opacity<1会创建新层叠上下文导致失效。
-
Cypress自定义命令默认不支持直接返回值，需通过.then()链式传递或cy.wrap().as()别名机制持久化数据；本文详解两种可靠方案，确保userID在createUser()生成后，可安全传入updateUser()等独立命令。
-
Grid子项默认拉高是因为align-items:stretch使子项在交叉轴上拉伸填满所在网格轨道高度，前提是行高可计算且子项未被height、max-height、min-height:0等样式阻止。
-
WebLocksAPI不能协调多个ServiceWorker实例间的锁，因同源下浏览器只允许一个ServiceWorker处于active状态；其生命周期为install→waiting→active，新旧版本不共存执行，所谓“多个实例”实为版本切换而非并发。
-
IE8及更早版本完全不支持::before/::after，仅IE9+支持双冒号；必须同时书写:before和::before且前者在前，IE7则需彻底弃用伪元素改用HTML替代。
-
Flexbox是最可靠的居中方案，父容器需设display:flex并同时使用justify-content:center和align-items:center；子元素须保持position:static，禁用absolute或float；IE10–11需加-ms-前缀，IE9及以下不支持。
-
JSON序列化Date对象具有单向性：stringify转为ISO字符串后，parse无法自动还原为Date实例，仅得普通字符串，需手动用newDate()恢复。
-
background-size用于控制背景图尺寸，取值包括auto、具体数值、百分比、cover和contain，配合background-position和background-repeat可实现全屏背景、图标缩放等效果。
-
必须掌握操作HTML元素的核心DOM方法：一、通过ID获取单个元素；二、通过类名获取元素集合；三、通过标签名获取元素集合；四、通过CSS选择器获取元素；五、为元素绑定事件监听器；六、创建并插入新元素；七、替换或删除现有元素。
-
sm:表示视口宽度≥640px时生效，lg:表示视口宽度≥1024px时生效，二者不互斥且lg优先级更高。
-
JavaScriptIntlAPI提供内置国际化支持，含DateTimeFormat和NumberFormat等接口，可自动适配多语言日期、时间、数字、货币格式，需注意语言标签准确性、浏览器兼容性及时区/货币显式配置。
-
summary标签本质是details的唯一交互锚点，必须为首个直接子元素；支持纯文本、内联元素（如<svg>）及emoji，但禁用块级元素；失效主因包括结构错位、CSS阻断（如pointer-events:none）或JS覆盖默认行为。
