-
最稳妥方式是在HTML的<head>中用<link>引入GoogleFonts并添加display=swap参数，配合带系统后备字体的font-family兜底链，可有效缓解FOIT/FOUT问题。
-
HTML5本身没有虚拟DOM，它是React、Vue等框架的JS层实现机制；原生中可通过DocumentFragment、条件更新、classList控制等减少重复渲染。
-
Flex子元素高度不一致主因是父容器高度塌陷、子项设了固定height或min-height、混用float/absolute定位，以及align-content/stretch在多行时的拉伸行为；需确保父容器有高度、子项不干扰flex拉伸、显式设置align-content:flex-start应对多行，必要时改用Grid。
-
应使用<code>标签包裹短小技术名词（如fetch()），用<pre><code>组合展示多行代码；<code>不保留换行缩进，且HTML特殊字符必须转义。
-
移动端弹窗margin:auto失效主因是元素缺明确width、受flex干扰或width:100%导致无收缩空间；应设max-width（如90vw）、避免width:100%，慎用transform居中以防软键盘引发偏移。
-
禁用按钮后仍可能触发点击事件，根源在于浏览器事件机制与DOM状态更新的异步性；本文详解其成因，并提供基于运行标志位的可靠防重复执行方案。
-
Terser是现代JavaScript压缩的默认选择，UglifyJS因不支持可选链、空值合并等新语法且压缩率低而被淘汰；Webpackv5+已内置Terser，无需安装uglifyjs-webpack-plugin，应通过terserOptions自定义配置。
-
生成器适合做任务切片，因其函数天然支持yield暂停与next恢复，精准匹配“执行一点→让出→空闲→再执行”逻辑，比setTimeout/Promise更易控节奏，比WebWorker更轻量。
-
blockquote::before必须声明content才渲染，否则伪元素不存在；引号推荐用\201C/\201D；cite属性需attr(cite)显式调用；父元素须position:relative；尺寸定位应使用em/rem适配响应式。
-
用HTML表格写报价表应严格遵循语义化规范：用<table><thead><tbody>结构，<thscope="col">定义列头，价格列统一用<tdclass="price">并配合CSS右对齐与等宽数字字体，禁用rowspan/colspan和空格对齐，导出Excel需加UTF-8BOM，移动端优化须设table-layout:fixed及列宽。
-
最简单方式是将<svg>标签直接写入HTML文件，作为原生DOM元素支持CSS/JS操作；需设置viewBox实现响应式缩放，避免冗余属性，颜色推荐用currentColor继承主题色。
-
SCSS中不能直接用变量调用rgba($r,$g,$b,$a)，应使用内置rgba($color,$alpha)函数或rgb()配合；mix()可替代实现视觉淡色效果，避免opacity对子元素的全局影响。
-
Vue响应式本质是数据劫持，通过Object.defineProperty（Vue2）或Proxy（Vue3）拦截读写操作，自动收集依赖（Dep）并通知Watcher更新视图。
-
IntersectionObserver可通过rootMargin（如"-10px0px0px0px"）和threshold:0精确控制元素距视口顶部触发时机；sticky失效主因是滚动容器缺失height/max-height导致无滚动上下文，解决方案为设置高度或用IntersectionObserver+translateY模拟吸顶状态。
-
UnoCSS配置更简洁的根本原因是属性化模式（Attributify）将class属性视为可解析DSL，无需预定义类名集合；它默认支持动态CSS生成，仅需配置shortcuts、rules和attributifyOptions等边界控制与语义映射。
