在前端开发中，我们经常会遇到各种各样的全局样式问题，如间距、字体大小、文本颜色等。当我们想要做一些特殊的样式设计时，这些全局样式会对我们造成很大的干扰。而解决这种问题的一种常见方法就是使用 CSS Reset。
什么是 CSS Reset？
CSS Reset 是一种通过重置浏览器默认样式来消除一些跨浏览器兼容性问题和提供更加一致的样式基础的技术。基本思路是打造一个空白的 CSS 样式表，用来移除浏览器的自带样式。这样，我们就可以自行定义所需要的全局样式，不再受限于浏览器的默认样式。
CSS Reset 的问题
虽然使用 CSS Reset 可以帮我们解决一些样式问题，但也会带来一些新的问题。比如，使用 CSS Reset 之后，可以避免出现默认样式导致的差异问题，但是也有可能使页面丧失了一些基本的可读性。
例如，当我们使用 CSS Reset 来清除页面中所有元素的默认样式时，我们会发现页面上所有的字体大小、颜色、文字排版等都发生了变化，这样就使得页面更难以阅读。这种情况下，我们需要再次手动定义一些全局样式，以帮助页面更加符合阅读习惯。
如何解决 CSS Reset 带来的问题？
解决上述问题的方法是使用 Normalize.css，它是一个轻量级的 CSS 库，可以解决 CSS Reset 带来的问题。该库旨在让默认的 HTML 元素在不同浏览器中表现一致，并修复一些浏览器的 bug 和常见的样式问题。
Normalize.css 是一种基于现代的样式重置技术的解决方案，它可以很好地解决一些样式上的问题，如字体大小、行高、图片边距、对齐等。
以下代码可以让你轻松使用 Normalize.css：
----- ---------------- ---------------------------------------
在引入了 Normalize.css 之后，我们就可以在页面中正确定义全局样式，从而避免了 CSS Reset 带来的问题。
总结
在前端开发中，处理全局样式是一件常见的任务，而使用 CSS Reset 可以帮我们消除浏览器默认样式造成的影响。但是，CSS Reset 也会带来一些问题，如页面丧失可读性等。因此，我们应该考虑使用 Normalize.css 来解决这些问题，从而更好地定义全局样式。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66519106d3423812e456c5ff