最小的CSS重置

您的 CSS 重置规则不必长达一英里，并且大多数现代浏览器现在都与它们的基本布局非常统一。 下面你会发现我认为是一个很好的重置最小有效剂量。 只需将其复制到您的新项目中，您就可以启动并运行。

🔖 将此页面添加为书签，以便快速轻松地参考

这是CSS重置：

html {
  box-sizing: border-box;
  font-size: 16px;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body, h1, h2, h3, h4, h5, h6, p, ol, ul {
  margin: 0;
  padding: 0;
  font-weight: normal;
}

ol, ul {
  list-style: none;
}

img {
  max-width: 100%;
  height: auto;
}

---

需要注意的几点

• 如您所见，我包含了一条规则，以便图像默认响应。
• 可以说，这个 CSS 重置最重要的部分是 box-sizing: border-box，因为这将确保一致且可预测的大小。 content-box 的默认值不考虑填充或边框。
• 如果要保留列表的默认项目符号，可以删除 ol 和 ul 的规则。
• 使用 font-weight: normal 标题默认情况下不会加粗。 如果您不介意默认外观，请将其删除。
• 我已将默认字体大小设置为 16px。 其他所有内容都可以以 rem 单位指定，它将基于该 16 像素。 然后，如果您想全局调整以使文本整体更大一点，您可以将基本规则更改为 17 或 18 像素。

🙈 觉得少了点什么？ 让联系这里让我们知道！