在开发前端页面时，布局问题是最常见的问题之一。不同的浏览器对 CSS 属性的支持不尽相同，可能会导致页面在不同浏览器中显示不一致。CSS Reset 是一种让所有浏览器样式表样式一致的方法。
什么是 CSS Reset？
CSS Reset 是一种将浏览器的默认样式全部重置为一组基本样式的方法。当浏览器的默认样式被清除后，开发者可以按照自己的喜好自定义样式。
为什么要使用 CSS Reset？
使用 CSS Reset 可以避免浏览器默认样式差异所造成的影响，提高网页的浏览器兼容性。CSS Reset 可以帮助网页设计师和开发者更好地控制网页布局和样式。
如何使用 CSS Reset？
方法一：使用第三方 CSS Reset
有一些第三方的 CSS Reset 已经成为了业界标准，例如 Eric Meyer 的 Reset CSS。直接引用这些框架，然后写你自己的 CSS 样式即可。
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
----------------------
----- ---------------- -----------------
----- ---------------- ------------------
-------
------
---- ---- ------- ---- ---
-------
-------方法二：手动编写 CSS Reset
如果你不想使用第三方 CSS Reset，可以手动编写 CSS Reset。下面是一个简单的 CSS Reset 示例代码：
-- -------------------- ---- ------- -- --- ------ ----- -- -- ---------- -------- - ----------- ----------- - -- ------ ------- ------- -- ---------- --------- - -------- -- - -- ------ ------- ------ -- ----- --- --- --- --- --- --- ---------- ---------- --- ------- ----------- ----------- --- -- - ------- -- - -- --- ---- ---- -------- -- ---- - ----------- ------ ---------------- ------- --------------- -------------- ------------ ---- - -- ------ ---- ------ -- --- -- -------- -- ---------- --------- - ----------- ----- - -- - -------- ---- ----- ---- - ----- --- ------- ------ -- -------------- - ------------------------- ----- - -- ---- ------ ------ -- ---- ---- -- --- - ---------- ----- -------- ------ -
手写 CSS Reset 的好处在于能够完全控制 CSS，更灵活，不受第三方框架限制。
结论
CSS Reset 可以帮助我们把开发中的布局问题最小化，让所有浏览器样式表样式一致。在编写 CSS 之前，加入一个 CSS Reset 确保你的样式能够得到一致的呈现。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6708fe04d91dce0dc875b250