在前端开发中，我们经常使用 CSS 进行页面的样式设计。但是不同浏览器对某些 HTML 元素的默认样式并不相同，这就导致了在不同浏览器上展示的页面效果也不同。要解决这个问题就要使用 CSS Reset。
CSS Reset 是什么？
CSS Reset 是一份包含常用样式的 CSS 文件，它的作用是将所有 HTML 元素的默认样式都清除或重置为相同的样式，以便开发者更容易地设计出符合自己需求的样式。
为什么要使用 CSS Reset？
解决浏览器样式不一致的问题 不同浏览器对默认样式的处理方式不同，这就导致了在不同浏览器上展示的页面效果也不同。使用 CSS Reset 可以解决这个问题。
降低开发难度 浏览器默认样式存在的意义是为了方便开发者开发页面，但是在实际的开发中，这些默认样式可能会制造一些问题。使用 CSS Reset 可以将所有元素的默认样式都清除或重置，这样可以降低开发难度。
提高网站性能 在网站加载过程中，浏览器会加载很多的默认样式文件，这会降低网站的性能。使用 CSS Reset 可以减小页面样式文件的体积，提高网站性能。
常用的 CSS Reset
目前比较常用的 CSS Reset 文件有以下几种：
- Eric Meyer Reset Eric Meyer Reset 是最早出现的 CSS Reset 文件之一，可以清除大多数平台的默认样式。
示例代码：
-- ---- ----- --- ----- --
----- ----- ---- ----- ------- ------- -------
--- --- --- --- --- --- -- ----------- ----
-- ----- -------- -------- ---- ----- -----
---- ---- --- ---- ---- ---- -- -- -----
------ ------- ------- ---- ---- --- ----
-- -- -- -------
--- --- --- --- --- ---
--------- ----- ------ -------
------ -------- ------ ------ ------ --- --- -- -
------- --
-------- --
------- --
-------- --
---------- -----
--------------- ---------
----------- ------------
-- Normalize.css Normalize.css 是另一款比较受欢迎的 CSS Reset 文件，可以保留一些有用的默认样式，并修复了一些浏览器的兼容性问题。
示例代码：
--- ------------- ------ - --- ------- - -------------------------------- --
--
--------
--------
--
---
- -- ------- ----------- -- ---- ---- ----- ----------- ------- -- ----
--
---- -
------------------------- -----
--------------------- -----
----------------- -----
-
---
- -- ------ ------- -------
--
---- -
------- --
-
--
-------- -------
----------------
--
---
- -- --- --- ------- --- ------ -- --------
- -- ---- --- -------- -- ---- --- ---
--
-- -
----------- ------------
------- --
--------- --------
-怎么使用 CSS Reset？
使用 CSS Reset 很简单，只需要将 CSS Reset 文件引入到你的 HTML 文件中就好了。通常情况下，我们会在页面的头部引入 CSS Reset 文件，以便覆盖默认样式。
示例代码：
--------- -----
------
------
----- ----------------
--------- --- -------------
----- ---------------- ---------------------
----- ---------------- ---------------------
-------
------
--------- --- -----------
---------------- --- -------------------- ---- ---------------------------------------------- --- ----------
-------
-------总结
CSS Reset 可以帮助我们解决浏览器默认样式不一致的问题，降低开发难度，提高网站性能。目前比较常用的 CSS Reset 文件有 Eric Meyer Reset 和 Normalize.css，使用起来也很简单，只需要将 CSS Reset 文件引入到 HTML 文件中就好了。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6464db9c968c7c53b05b40c2