1. 什么是 CSS Reset？
CSS Reset 是一种前端开发中常用的技术，通过一系列的 CSS 样式，将浏览器默认的样式全部重置，达到不同浏览器的统一。这样可以在开发过程中更加方便地编写自己的 CSS 样式。
2. CSS Reset 对页面的影响
虽然 CSS Reset 可以达到统一样式的效果，但它也有其不好的地方。比如我们常用的一些标签，如 a、p、h1 等，因为 CSS Reset 的存在，其样式完全常常被覆盖，需要自己再次编写样式，增加了工作量。
更重要的是，在某些情况下，CSS Reset 会对网站产生意外的影响。例如，当使用 CSS Reset 消除表格边框时，可能会使用以下代码：
----- - ---------------- --------- --------------- -- -
这样可以避免表格中的多于边框，可是一些高级表格，如需要自定义格线的表格，可能就会受到影响。
3. 选择 CSS Reset 还是 Normalize.css？
针对 CSS Reset 带来的负面影响，一些前端工程师发明了 Normalize.css，一种在 CSS 样式层面上解决浏览器样式不统一的技术（如：重置元素的执行效果，保留它本来的设计意图，并且符合如今的 Web 标准）。
相比于 CSS Reset，Normalize.css 不是完全消除浏览器的样式，而是在这个基础上进行适度、轻微的“重启样式”，尤其对于表现不支持的 bug 和性能较差的浏览器（比如 IE）进行了较好的兼容性处理。
如果选择使用 Normalize.css，首先需要将其导入到项目中，例如：
------ ----- ---------------- --------------------- -------
4. 什么时候需要使用 CSS Reset 或 Normalize.css？
CSS Reset 或 Normalize.css 并非适用于所有情况。必须考虑到自己项目的实际情况。比如，如果网站需要定制化的样式，那么就不需要使用这两种方式，而应该根据项目需求和设计风格自行编写样式规则。
然而，在进行原型设计或者前期，使用 CSS Reset 或 Normalize.css，可以将一些基础的样式重置，帮助前端工程师更容易地进行后续的样式编写。
5. 如何自定义 CSS Reset 或 Normalize.css？
如果考虑采用 CSS Reset 或 Normalize.css，而现有的规则不适用于自己的项目，那么就需要进行自定义。
以 Normalize.css 为例，需编辑 normalize.css 文件，根据自己的需求进行修改。例如，我们可以修改全局的字体颜色及字体大小：
---- - ------------ ---------- ------ ---------- ------ ----------- ---------- ----- ------ -------- -
以上代码将字体设置为黑色，大小为 16 像素。由于 body 元素被用于全网站，所以这些样式会直接影响整站的所有文本。
6. 总结
总之，CSS Reset 及其核心的 Normalize.css 是帮助前端工程师解决浏览器样式不统一问题的有力工具，同时也对网站的性能、可维护性和用户体验有很大的促进作用。但我们需要根据项目具体情况，选择适合自己的解决方案，有效地管理好代码，提高工作效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/646f3c77968c7c53b0da1b72