CSS Reset 是一种常见的前端技术，用于在浏览器中消除默认样式的细小差异，以达到更加一致的外观。然而，在实际开发中，我们不推荐使用通用的 CSS Reset。
多余样式
通用的 CSS Reset 包含了许多样式，但其中许多样式并没有在实际项目中被使用到。这些多余的样式不仅占用无用的空间，而且会在浏览器中造成不必要的计算，进而导致网站的性能变差。
复杂度
通用的 CSS Reset 是一份复杂的代码库，需要大量时间和精力来理解和维护。传统的 Reset 方法还面临着许多问题，比如隐藏元素 CSS 化的错误导致默认样式的改变，不同浏览器之间样式的兼容性问题等，使其使用在实际生产中更加困难，甚至有些情况下会导致项目出现严重的 Bug。
独一无二的外观
通用的 CSS Reset 能够消除默认样式，但是有时候我们需要一些有特色的外观和样式，这时候使用通用的 CSS Reset 就可能会给我们带来麻烦。过于依赖通用 Reset 很容易使得我们的项目出现平凡、毫无特色的外观，缺乏个性化。
如何代替通用 CSS Reset
Normalize.css
Normalize.css 是一种完全不同于 CSS Reset 的解决方案，它通过重新定义默认样式、修复浏览器的 bug、提供更好的可访问性以及优化 CSS 的一些其他方面的方案来发挥作用，该方案会对非常固定的样式重置成默认值，而不是全部清理掉它们。
Normalize.css 相比通用 Reset 有以下优势：
- 不会干扰表格、表单等表现层次（presentational）基础样式
- 修正了少部分浏览器 bug，比如前面提到的
<hr>的样式差异 - 修复了浏览器的风格问题，例如 HTML5 结构元素的字体重置
- 顺应了现代化趋势，例如去掉了不用的样式，添加了新元素的样式
全局样式表
另外，我们也可以通过创建一个全局样式表，来代替通用 Reset。
- - ----------- ----------- ------- -- -------- -- -
这个样式表重新规定了 box-sizing 属性，设置 margin 和 padding 为 0，使得所有元素在默认情况下都具有相同的盒模型和边距。这种方式与 CSS Reset 相比，更加轻便和易于维护。同时，在项目中，可以通过选择某些元素来定义自己的外观和样式，进而使得网站更具个性化。这种方式下的样式代码优化更容易实施，降低代码维护成本。
结论
通用 CSS Reset 包含大量多余的样式，复杂度较高，不适用于实际应用。我们可以通过 Normalize.css 以及创建全局样式表来代替通用 CSS Reset，从而使得样式表变得更加轻便和易于维护，并保留个性化的样式。
我们要从这个例子中学习到，为了更好地造福于开发社区，我们应该更加合理地选择合适的技术，使得项目更加高效、简洁、灵活。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6721c4242e7021665e08b235