在企业级开发中，为了保证页面的兼容性及一致性，往往需要使用 CSS Reset 方案。CSS Reset 是一种技术，它通过清除浏览器默认样式来消除跨浏览器样式差异，并提供一组基本的 CSS 样式规则，以便设计师和开发者可以在不同的浏览器中以一致的方式显示页面。本文将介绍不同的 CSS Reset 方案，以及如何针对企业级开发使用它们。
常用的 CSS Reset 方案
Normalize.css
Normalize.css 是一种流行的 CSS Reset 方案，它试图通过调整浏览器默认样式和提供一些额外的样式规则来创建一系列一致的样式。Normalize.css 能够解决 HTML5 元素的跨浏览器样式一致性，并修复不同浏览器之间的一些常见问题，例如浏览器之间的表单样式不一致。使用 Normalize.css 可以使得最终渲染的结果在不同的浏览器中基本一致。
Reset.css
Reset.css 是一种典型的 CSS Reset 方案，它通过在所有 HTML 元素上强制使用相同的默认值来重置所有浏览器的样式表，并消除了一些常见的浏览器差异。其中，Reset.css 可以完全清除所有的浏览器默认样式，从而可以完全自定义样式。
Yahoo Base CSS
Yahoo Base CSS 是 Yahoo 开发的一个 CSS Reset 方案，它试图消除不同浏览器之间的样式差异，并提高各种浏览器之间的一致性。Yahoo Base CSS 重置了一些普遍存在的问题，例如表单元素的外边距，以及一些浏览器之间不同的字体大小。此外，Yahoo Base CSS 还提供了一些基本样式，用于加快页面开发的速度。
如何使用
使用这些 CSS Reset 方案，可以提高跨浏览器兼容性，主要分为以下几个步骤：
下载 CSS Reset 文件
下载所需的 CSS Reset 文件，例如 Normalize.css、Reset.css 和 Yahoo Base CSS，并将它们放置在您的项目文件夹中。这些文件可以作为单独的文件，也可以与其他样式表合并在一起。
链接网页
在您的 HTML 文件中链接所需的 CSS Reset 文件。在<head>中添加以下代码：
<link rel="stylesheet" type="text/css" href="normalize.css" />
如果您需要使用多个 CSS Reset 文件，则需要将它们链接在同一行中，例如：
<link rel="stylesheet" type="text/css" href="reset.css" /><link rel="stylesheet" type="text/css" href="yahoo-base.css" />
自定义样式
使用这些 CSS Reset 方案后，您的页面将会出现一个完全重置的外观。为了对网页实施自定义 CSS 样式，您可以创建一个单独的样式表，并在 HTML 文件中链接它。请确保在您的 CSS 文件中添加!important 标记，以确保您的样式优先于 Reset 方案中的样式。
body {
background-color: #c5dbca !important;
font-family: Arial, sans-serif !important;
font-size: 16px !important;
}结论
在企业级开发中，使用 CSS Reset 方案可以为大家提供跨浏览器一致的页面外观和行为。Normalize.css、Reset.css、Yahoo Base CSS 是其中的三种常用的方案，我们需要根据项目特点和设计需求选择合适的方案进行使用。在使用的过程中，我们需要注意 Reset 方案会重置所有的 CSS 样式，因此在实施自定义样式时，请加上!important 标识，以确保您的样式优先于 Reset 方案的样式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/671b148a9babaf620fa7a048