-
抖动动画应使用translateX()实现左右位移，而非rotate()；需配合@keyframes定义0%/25%/50%/75%/100%偏移序列，偏移量控制在±2px~±6px；必加animation-fill-mode:forwards（或用both），缓动选cubic-bezier(.36,.07,.19,.97)；JS触发前需清空旧动画并强制重排；移动端慎用will-change，仅加translateZ(0)保障硬件加速。
-
Autoprefixer是解决CSS浏览器兼容性的核心工具，它基于CanIUse数据库和Browserslist配置，自动为需兼容的属性添加必要前缀，避免手动书写导致的冗余、错误或失效问题。
-
<p>JSX不是HTML，需改class为className、for为htmlFor、自闭合标签加/、内联样式用对象、注释用{//}；脚本逻辑须转为React状态与事件机制；资源路径需按模块系统处理；表单推荐受控组件。</p>
-
应设为具体属性名而非all，如transform、opacity；timing-function优先用cubic-bezier调试；delay失效多因强制布局，需用requestAnimationFrame规避；transitionend监听需避免display切换和伪元素限制。
-
Promise.withResolvers()的核心价值是让Promise构造脱离newPromise()闭包束缚，使resolve/reject可在任意作用域安全调用，解决跨组件、跨模块、跨事件循环的状态注入难题。
-
HTML的dir属性优先级高于CSSdirection；浏览器优先读取元素自身的dir值，再回退到继承或样式声明，且dir属性会覆盖direction样式。
-
img的border属性在HTML5中已被完全移除，应改用CSS的border属性统一控制；table的border属性虽仍被支持，但仅作为呈现提示影响传统渲染模式，推荐显式使用CSS设置border-collapse和border样式。
-
箭头函数无this绑定，继承外层作用域this；适合回调等无需动态this场景，不适用于对象方法、构造器等需独立this的场合。
-
应复用同一Audio实例并在用户首次交互时预播放以解锁权限，用布尔变量控制开关状态，封装triggerCelebration函数解耦业务逻辑，按钮同步aria-pressed与audio.muted，iOS需预热播放或降级WebAudioAPI。
-
grid-template-columns应设为“200px1fr”实现导航栏定宽、内容区自适应，配合grid-template-areas和grid-area精准定位nav与main，容器需加min-height:100vh防塌陷，移动端改用grid-template-areas:"nav""main"与grid-template-columns:1fr实现响应式。
-
在CSS中使用Less制作动态主题切换，核心思路是利用Less的变量和混合（mixin）能力预定义多个主题样式，再通过JavaScript动态切换根元素或body上的类名，从而激活不同主题的样式规则。以下是具体实现方法。1.使用Less定义主题变量创建一个themes.less文件，为不同主题定义颜色变量：//themes.less@primary-color-light:#3498db;@text-color-light:#333;@b
-
Map适合非字符串键的有序映射，Set用于去重和存在性检查，WeakMap/WeakSet用于对象键的弱引用场景，普通Object适用于静态配置。
-
使用HTML的details和summary标签可快速实现折叠功能，适合简单场景；对于需要自定义样式和动画的效果，推荐结合HTML、CSS与JavaScript，通过控制元素的显示状态或利用max-height过渡实现平滑展开收起效果。
-
Redux通过单一不可变状态树集中管理应用状态，确保数据一致性与可预测性；状态更新需通过派发action触发，经由纯函数reducer处理并返回新状态，从而实现可追踪、可调试的状态变更流程。
-
HTML无法单独实现交互式看板，需CSS+JavaScript配合：用flexbox布局三列容器，监听dragstart/drop事件实现拖拽，通过localStorage保存卡片ID序列状态。
