不能直接用 * { margin: 0; padding: 0; }，因其破坏表单控件可点击性、移除焦点轮廓、损害语义元素结构，并拖慢样式计算；应优先使用 normalize.css 进行差异修复，局部重置才考虑 all: unset 并补 display。
为什么不能直接用 * { margin: 0; padding: 0; }
它看着省事，但会把 <textarea></textarea>、<select></select>、<input> 的可点击区域缩到几乎无法点击——这些控件依赖默认 padding 提供触控/点击容错；button 的焦点轮廓（outline）也会消失，键盘用户完全找不到当前焦点；<pre class="brush:php;toolbar:false;"></pre> 和 <blockquote></blockquote> 失去结构感，阅读体验断层。更隐蔽的问题是：浏览器要为每个 DOM 节点匹配这条规则，节点多时明显拖慢样式计算。
该用 normalize.css 而不是 reset
normalize.css 不是清空，而是修复差异：保留 h1～h6 的语义层级关系，只统一 margin 值；让 ul/ol 在所有浏览器中都用 padding-left 实现缩进（而不是有的用 margin、有的用 text-indent）；sub/sup 垂直对齐一致；input 和 button 在 Chrome/Firefox/Safari 中尺寸、行高、光标行为更接近。引入方式极简，且必须放在自定义 CSS 之前：
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
局部重置时优先用 all: unset
仅当你封装完全自定义组件（比如一个 UI 库里的 Button），且明确拒绝任何父级或浏览器默认样式干扰时，才考虑局部归零。注意：all: unset 会清掉 display，必须手动补上：
.my-button {<br> all: unset;<br> display: inline-block;<br> /* 其他自定义样式 */<br> }
-
all: unset清除继承值 + 初始值，但不重置direction和unicode-bidi - 别对
或用all，它会干掉滚动条、焦点轮廓等底层行为 - 想恢复某个元素的原生样式？用
all: revert，比如让某个被重置过的button回到浏览器默认
按钮和表单控件必须单独精细处理
button 的默认样式最顽固：不同浏览器对 font-size、line-height、vertical-align 计算方式不同，只写 padding: 0; border: none; 远不够。
- 加
box-sizing: border-box避免边框撑大尺寸 - 加
appearance: none及其前缀（-webkit-appearance、-moz-appearance）关闭原生渲染 - 加
font: inherit; line-height: normal; vertical-align: middle;解决基线漂移和字体撑高 -
input[type="button"]和input[type="submit"]必须同步处理，否则视觉割裂
真正容易被忽略的是：重置不是写一次就完事的动作——每次接入新浏览器测试环境、每次集成第三方 UI 组件，都要重新确认它是否还“干净”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
