什么是 CSS Reset？
在网页开发中，每个浏览器都有自己的默认样式，这些默认样式可能会影响到我们自己编写的样式。为了规范化不同浏览器之间的差异，我们通常会使用 CSS Reset 来重置样式。
CSS Reset 可以理解为将所有样式都重置为最基础的状态，让我们能够在一个统一的基础上编写自己的样式，同时避免了不同浏览器之间的差异。
CSS Reset 的优点
统一样式：通过使用 CSS Reset，我们能够将所有浏览器的默认样式都重置为同一个基础样式。这样一来，我们可以更加自由地编写自己的样式，同时保证不同浏览器之间的显示效果一致。
减少冗余代码：浏览器自带的默认样式会有很多冗余的代码，而这些代码都是不必要的。使用 CSS Reset 可以帮助我们减少冗余代码，提高整体性能。
避免浏览器兼容性问题：由于不同浏览器的默认样式不同，这很容易导致兼容性问题。通过使用 CSS Reset，我们能够尽可能避免这些问题的出现，让我们的网站在不同浏览器之间能够正常显示。
CSS Reset 的实现方式
下面是一种常用的 CSS Reset 实现方式：
// javascriptcn.com 代码示例
/* 重置所有元素的内外边距，边框的样式设置为空 */
* {
margin: 0;
padding: 0;
border: 0;
}
/* HTML5 元素初始化样式 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
/* a 标签默认样式 */
a {
text-decoration: none;
color: inherit;
}
/* ul、ol 默认样式 */
ul,
ol {
list-style: none;
}
/* 图片默认样式 */
img {
display: block;
}
/* 表格默认样式 */
table {
border-collapse: collapse;
border-spacing: 0;
}如果你使用了 CSS Reset，那么在编写样式时就要考虑到一些默认样式的缺失。比如，没有了默认的外边距和内边距，我们就需要手动设置它们，否则可能会出现排版异常的问题。
CSS Reset 的适用场景
虽然 CSS Reset 在大多数开发场景中都是可行的，但是并不是所有场景都需要使用它。以下是一些适合使用 CSS Reset 的场景：
多平台、多设备适配
需要统一样式表现的公共组件
开发需要对样式抠细节
总结
CSS Reset 可以帮助我们避免不同浏览器之间的差异，规范化网页样式，并减少冗余代码。在开发中使用 CSS Reset 可以提高开发效率和优化网站性能，但是在使用时需要考虑到它可能带来的一些问题。在实际开发中，我们需要根据实际情况来决定是否使用 CSS Reset。
参考链接：CSS Reset - 一种浏览器标准化样式的方法
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654ef6407d4982a6eb8038a6