应重置而非仅引入normalize.css，因其仅标准化而非清空默认样式；推荐modern-normalize加局部reset，避免全量重置破坏语义与可访问性。
为什么要重置而不是直接用 normalize.css
直接引入 normalize.css 并不能解决你项目里按钮默认有内边距、表单控件高度不一致、h1 到 h6 字体大小混乱等问题。它只是“标准化”浏览器默认行为，不是“清空”。如果你需要从零开始控制所有基础样式（比如设计系统起步、微前端子应用隔离），就得主动重置——但别手写 * { margin: 0; padding: 0; }，那会破坏表单可访问性和原生语义。
推荐用 modern-normalize + 局部 reset 组合
现代项目最稳妥的做法是：用 modern-normalize 处理跨浏览器差异，再对特定元素做轻量级 reset。它比老版 normalize.css 更精简，且保留了 button、input 的默认 focus 样式和语义行为。
- 安装：
npm install modern-normalize - 在入口 CSS 或主样式文件顶部引入：
@import 'modern-normalize';
- 紧接着加几行关键 reset（只针对你真正在用的组件）：
button, input, select, textarea { font: inherit; line-height: normal; } button, [role="button"] { cursor: pointer; } img { max-width: 100%; height: auto; }
避免用 CSS Reset 工具生成全量重置样式
像 eric-meyer-reset 或某些在线“CSS 初始化生成器”输出的全量重置，会把 ol、ul 的列表符号干掉，把 blockquote 的缩进抹平，甚至让 details 和 summary 失去默认交互逻辑。这些不是“初始化”，是“破坏”。工具可以帮你生成结构，但不能替你判断哪些元素该保留原生表现。
- 检查你项目是否真用到了
fieldset、legend—— 如果不用，就别重置它们 -
table相关样式（border-collapse等）只在需要表格布局时才显式设置，不要全局覆盖 - 慎用
all: unset，它会让svg图标丢失宽高、video控制栏消失
PostCSS 插件适合团队统一规范，但别依赖它自动修复
如果团队多人协作，可以用 postcss-preset-env + 自定义插件在构建时注入基础样式，但注意：这类自动化只适合补漏，不能替代人工决策。
立即学习“前端免费学习笔记（深入）”；
- 例如用
postcss-initial自动给新声明的类加box-sizing: border-box，但它不会知道你某个.card是否该继承font-family - CI 流程中可加检查：禁止提交含
* { box-sizing: border-box }的全局规则 - 真正省时间的是建立内部 snippet 库，比如 VS Code 中配置一个
css:init用户代码片段，插入的是上面提到的 modern-normalize + 四行核心 reset
实际项目里最常被忽略的，是 reset 后没同步更新设计系统的文本层级（font-size、line-height）和间距比例（margin-bottom 基准）。样式初始化不是一步到位的动作，而是后续所有组件样式生效的前提条件。
