Normalize.css是一个优化浏览器默认样式的CSS库，它保留有用样式的同时修复跨浏览器不一致，如标题字号、表单控件外观、small字体问题及pre代码换行；相比归零式CSS Reset，它更智能地统一元素表现；通过CDN、NPM或本地引入，建议在自定义样式前加载；虽不能替代项目级初始化，常需配合box-sizing、字体栈等设置使用。
在网页开发中，不同浏览器对HTML元素的默认样式存在差异。这些差异可能导致页面在Chrome、Firefox、Safari或Edge中显示效果不一致。为了提升跨浏览器的一致性，开发者常使用CSS重置工具，其中 Normalize.css 是最广泛采用的方案之一。
什么是Normalize.css？
Normalize.css 并不是一个彻底清除样式的工具，而是一个让浏览器默认样式更一致的CSS库。它保留有用的默认样式，修复浏览器间的不一致，并确保HTML元素在不同环境中表现统一。
与老式的“CSS Reset”（如Meyer Reset）不同，Normalize.css 不会将所有元素的边距、字体大小等全部归零。它更智能地处理样式差异，比如：
- 修正
h1-h6标题元素在各浏览器中的字号差异 - 统一
button、input、select表单控件的外观 - 修复
small元素在部分浏览器中字体过小的问题 - 确保
pre和code标签正确换行和样式展示
为什么选择Normalize.css而不是默认样式？
浏览器自带的默认样式表（user agent stylesheet）虽然提供基础排版，但它们不是标准化的。例如：
立即学习“前端免费学习笔记（深入）”；
- Safari 可能给
a链接添加额外的点击高亮 - IE 对
box-sizing的默认处理与其他浏览器不同 - 移动端浏览器对按钮和输入框有特殊渲染规则
Normalize.css 通过一组经过测试的规则，抹平这些差异。它不会让你从零开始设计所有元素样式，而是提供一个稳定、可预测的基础。
Angel工作室企业网站管理系统全DIV+CSS模板，中英文显示，防注入sql关键字过滤，多浏览器适应，完美兼容IE6-IE8,火狐，谷歌等符合标准的浏览器，模板样式集中在一个CSS样式中，内容与样式完全分离，方便网站设计人员开发模板与管理。系统较为安全，以设计防注入，敏感字符屏蔽。新闻，产品，单页独立关键字设计，提高搜索引擎收录。内置IIS测试，双击打启动预览网站 Angel工作室企业网站
如何使用Normalize.css？
引入 Normalize.css 非常简单，可以通过以下几种方式：
-
CDN 引入：在HTML的
中加入： cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" rel="stylesheet"> - NPM 安装：项目中运行 npm install normalize.css，然后在入口CSS或JS中导入
- 本地复制：将源码文件下载并放入项目静态资源目录
建议在自定义样式表之前加载 Normalize.css，以确保你的样式可以基于统一的基础进行覆盖。
Normalize.css 的局限性
尽管 Normalize.css 解决了大多数通用问题，但它不能完全替代项目级的样式初始化。你可能仍需补充：
- 设置全局
box-sizing: border-box - 统一字体栈（font-family）
- 清除列表默认样式（如导航菜单）
- 响应式图片设置：
img { max-width: 100%; }
这些通常配合 Normalize.css 一起使用，构成完整的“CSS 初始化”策略。
基本上就这些。Normalize.css 不复杂但容易忽略，却是构建跨浏览器兼容页面的重要一步。
