默认 box-sizing 仍为 content-box，需手动设置 、::before、*::after 为 border-box 并置于 reset 后；同时 reset 清除 margin/padding 后须重定义语义元素间距与行内元素表现。
box-sizing 默认值在 reset 后仍为 content-box
多数 CSS reset（如 normalize.css 或经典 Eric Meyer Reset）会重置 margin 和 padding 为 0，但**不会修改 box-sizing 的默认行为**。这意味着所有元素依然使用 content-box，即宽度/高度仅包含内容区，不包含内边距和边框。
这容易导致布局错位：比如你设了 width: 200px; padding: 10px; border: 1px solid，实际占用宽度是 200 + 20 + 2 = 222px，而开发者常误以为就是 200px。
- reset 只清样式，不改盒模型语义
-
box-sizing是独立 CSS 属性，需显式设置 - 现代 reset（如
modern-normalize）也不自动设box-sizing: border-box
为什么 reset 后还要手动加 box-sizing: border-box
因为浏览器原生默认就是 content-box，reset 不会、也不该越界去覆盖这个底层渲染逻辑。要统一盒模型行为，必须主动声明：
*, *::before, *::after {
box-sizing: border-box;
}
这条规则必须写在 reset 样式之后（否则被覆盖），且建议放在 :root 或全局样式最顶部。
立即学习“前端免费学习笔记（深入）”；
- 若用
postcss-preset-env等工具，它不会自动注入该规则 - 某些 UI 库（如 Bootstrap 5）自己写了
border-box，但仅限其组件内部作用域 - 漏掉
*::before, *::after会导致伪元素仍按content-box计算，引发意外溢出
margin 和 padding 清零后，行内元素表现更敏感
reset 把 margin 和 padding 设为 0 后，<span></span>、<a></a>、<strong></strong> 等行内元素的垂直对齐和行高会更“裸露”，尤其在配合 line-height 或 vertical-align 使用时：
-
<span></span>原本可能有浏览器默认margin缓冲，清零后紧贴文字基线，易出现锯齿感 -
<button></button>虽是替换元素，但部分浏览器对其padding有隐式处理，reset 后需重新补足 - 表格单元格（
<td>）的 <code>padding被清零后，内容会贴边，必须手动加回兼容性与性能小提醒
box-sizing: border-box在 IE8+ 完全支持，无需前缀；但注意：- 旧版 Android Browser（4.3 及以下）对
*::before, *::after的box-sizing支持不稳定，生产环境若需兼容，可改用类选择器局部控制 - 全局通配符
*在超大 DOM 下有轻微性能影响，但对现代设备基本可忽略 - reset 清除
margin/padding后，别忘了给<p></p>、<h1></h1>等语义元素重新定义视觉间距——否则整页文字会挤成一团
真正麻烦的不是 reset 本身，而是 reset 后忘记重建「视觉节奏」和「盒模型预期」。这两处不补，再好的 reset 也只是一张白纸。
- 旧版 Android Browser（4.3 及以下）对
