什么是 CSS Reset
在编写网页时，我们常常使用 CSS 样式来美化页面，但是不同浏览器对于默认样式的处理方式不同，这就导致了同一份 CSS 样式在不同浏览器上呈现的效果也不同。为了解决这个问题，CSS Reset 技巧应运而生。
CSS Reset 技巧的核心思想是将不同浏览器对于默认样式的处理方式标准化，从而使得同一份 CSS 样式在不同浏览器上呈现的效果尽量一致。
常见的 CSS Reset 技巧
Normalize.css
Normalize.css 是一个广泛使用的 CSS Reset 库，它的目标是让不同浏览器的默认样式尽量一致。Normalize.css 的使用非常简单，只需要在 HTML 文件中引入即可：
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
Eric Meyer's Reset CSS
Eric Meyer's Reset CSS 是 CSS Reset 技巧的经典之作，它通过清除浏览器默认样式来标准化页面样式。Eric Meyer's Reset CSS 的使用也非常简单，只需要在 HTML 文件中引入即可：
<link rel="stylesheet" href="https://meyerweb.com/eric/tools/css/reset/reset200802.css">
自定义 CSS Reset
除了使用现成的 CSS Reset 库外，我们还可以根据自己的需求自定义 CSS Reset。下面是一个简单的自定义 CSS Reset 的示例代码：
-- -------------------- ---- -------
----- ----- ---- ----- ------- ------- -------
--- --- --- --- --- --- -- ----------- ----
-- ----- -------- -------- ---- ----- -----
---- ---- --- ---- ---- ---- -- -- -----
------ ------- ------- ---- ---- --- ----
-- -- -- -------
--- --- --- --- --- ---
--------- ----- ------ -------
------ -------- ------ ------ ------ --- --- -- -
------- --
-------- --
------- --
---------- -----
------------ -------
--------------- ---------
-总结
CSS Reset 技巧是前端开发中非常重要的一环，它可以让同一份 CSS 样式在不同浏览器上呈现的效果尽量一致，从而提高网站的美观度和用户体验。本文介绍了三种常见的 CSS Reset 技巧，包括 Normalize.css、Eric Meyer's Reset CSS 和自定义 CSS Reset，并提供了示例代码。希望本文对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65816242d2f5e1655dc9624b