前言
在学习 web 开发过程中，对于刚刚接触前端的开发者来说可能会发现，不同浏览器在渲染网页时会有不同的默认样式，这会对页面布局和样式的一致性造成不小的影响，并且在排查问题时也会增加难度。因此，使用 CSS Reset 工具可以很好的解决这个问题，使得我们能够更好的控制网页的样式。
什么是 CSS Reset？
CSS Reset，指的是一些预定义的样式集合，用于重置浏览器的默认样式。通过使用 CSS Reset，我们可以避免因为浏览器默认样式不同而带来的不必要的麻烦。
CSS Reset 并不仅仅是清除浏览器默认样式，它还有更重要的作用。CSS Reset 可以使网页排版更加一致，使得我们的代码更容易理解和维护。
CSS Reset 核心知识与技巧
CSS Reset 的原理
CSS Reset 原理十分简单，它会将所有 HTML 元素的内外边距、边框等样式设置为统一值。这样可以避免不同浏览器默认样式带来的影响，也可以方便我们重新定义样式。但是，需要注意的是，使用 CSS Reset 有可能会破坏有些样式布局，因此需要根据实际需求进行选择性的使用。
常用的 CSS Reset 工具
Normalize.css
Normalize.css 是一个流行的、广泛使用的 CSS Reset 工具。它可恢复浏览器的一致性，并通过提供一个通用的样式覆盖集合来重新定义 HTML 元素。Normalize.css 可以重置不同浏览器之间的默认样式，使得页面在不同浏览器中保持一致。
----- ---------------- ------------------------------------------------------------------------------- --
Reset.css
Reset.css 是最早的 CSS Reset 工具之一。与 Normalize.css 相比，它的 Reset.css 只是简单地将 HTML 元素的样式重置为一个共同的起点。由于 Reset.css 使用起来较为简单，因此在一些小型项目处理样式方面可应用于适用性更好的规则。
----- ---------------- ---------------------------------------------------------- --
如何使用 CSS Reset？
为了使用 CSS Reset，只需要在你的 HTML 文件中引入 CSS Reset 文件，就可以轻松地使用。在引入样式表文件时，应该确保服务端发送的网页 Content-Type 头信息必须正确地声明为 text/html。
--------- -----
------
------
----- --------------- --
--------- --- -------------
----- ---------------- ---------------- --
-------
------
---- ---- ---
-------
-------配置自定义 CSS Reset？
如果你喜欢，你也可以修改 CSS Reset 文件中的样式，使之符合自己的需求。这里，我们以 Normalize.css 为例，来讲解一下如何自定义样式。
我们可以修改 Normalize.css 文件中对某个元素的默认样式，以.marquee { overflow: -moz-scrollbars-none; }为例，可以将其中的某些值修改为我们自己期望的值。
结论
CSS Reset 工具可以让我们轻松地处理浏览器样式差异的问题，并使得网页排版更加一致，样式更美观。尽管定义的样式可能与部分元素的使用有所冲突，但作为初学者除非自己有非常特殊的需求，大多数情况下使用 CSS Reset 工具还是很有帮助的。
参考文献
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/670f299f5f55128102632004