-
margin:auto在flex容器中能居中是因为它会吞噬主轴和交叉轴的剩余空间；前提是父容器为flex且子元素未设置flex-grow/shrink，且交叉轴尺寸必须可计算。
-
嵌套Grid需独立设置gap，父级不继承；通过统一变量管理间距，确保视觉一致。示例：根变量设--base-gap，父容器gap用该变量，子Grid也应用相同变量，避免错位或拥挤。使用gap而非margin，保持对齐整洁，配合开发者工具检查盒模型，提升维护性与响应式体验。
-
应保留单个<link>标签，通过构建工具（如Sass@use）将功能模块（_buttons.scss等）编译合并为一个main.css，避免HTML中多link引发的加载阻塞、依赖失控与缓存问题。
-
transform:scale()是transform属性的函数值，必须写为transform:scale(1.2)，漏前缀、错位置或用于inline元素均无效；缩放中心需用transform-origin调整；放大后文字模糊、溢出、点击失效等问题需配合will-change、pointer-events等修复。
-
Less编译时应通过外部传参动态注入版本号，如lessc的--modify-var或Webpackless-loader的modifyVars，避免硬编码；需确保变量参与输出、注释不被压缩工具删除，且来源为Git标签或CI环境变量。
-
HTML/CSS边框错位的五大精准对齐方案：一、box-sizing:border-box统一尺寸基准；二、消除inline-block空白间隙；三、CSSGrid像素级控制；四、border-collapse处理表格边框；五、transform:translateZ(0)修正亚像素渲染。
-
根本原因是缩放导致CSS像素与物理像素对齐错位，触发0.5px级渲染裂缝；应优先用vw/vh替代px、避免单位混用，并将偏移交由支持亚像素的transform:translate()处理。
-
JavaScript的函数式风格指以纯函数、不可变数据、声明式组合为核心的编程范式，要求函数无副作用、不修改状态、用const替代let/var，并通过pipe/compose组合单参数纯函数。
-
优先用typeofSVGFilterElement!=='undefined'判断SVG滤镜基础支持，Safari9–13.1需额外测试feGaussianBlur渲染生效性；IE完全不支持；内联filter属性比CSSfilter更稳定；feConvolveMatrix等高开销原语在iOS易失效，建议fallback至CSSblur或预渲染PNG。
-
Vue.js中watch可监听多个搜索条件变化并同步到URL查询参数，需聚合监听、防抖处理、避免循环触发，推荐用计算属性汇总参数并监听其变化，结合路由API实现单向数据流。
-
用CSSGrid的repeat(3,1fr)可简洁实现3×3九宫格布局，无需设置子项宽高，配合gap、响应式媒体查询和基础样式增强即可快速完成自适应九宫格。
-
闭包在回调队列中扮演核心角色，因为它能捕获并持久化外部作用域的变量，确保回调函数在异步或延迟执行时仍可访问创建时的上下文。1.闭包是函数与其词法环境的组合，使内部函数能“记住”外部变量，即使外部函数已执行完毕；2.回调队列依赖闭包维护状态，避免因异步执行时机导致的变量丢失或污染，尤其在循环中为每个回调绑定独立的变量值；3.构建回调队列时，通过函数返回的方法（如add和run）闭包引用队列数组，实现私有状态的持久化和安全访问；4.在异步操作中，闭包将请求参数（如URL、DOM元素ID）与回调逻辑绑定，无需全
-
依赖注入通过外部传入依赖降低耦合，提升可测试性与可维护性。JavaScript中可通过构造函数注入、工厂函数或DI容器实现：构造函数注入将依赖作为参数传递，便于替换和测试；工厂函数集中管理对象创建，减少重复代码；DI容器自动解析依赖，进一步解耦。关键优势包括依赖清晰、易于测试、灵活替换实现和减少硬编码，有效提升代码质量。
-
虚拟列表通过只渲染可视区域内的元素来提升长列表性能。它基于视口位置动态计算显示范围，用空白占位保持滚动体验，核心步骤包括容器设置、高度计算、滚动监听与可视项更新，适用于大量数据场景如聊天记录、表格展示等。
-
推荐将CSS变量统一定义在:root中，如--card-border-color、--card-border-width等，配合fallback值和显式transition实现主题切换与响应式更新，避免命名笼统或跨组件耦合。
