小编典典

Normalize.css 和 Reset CSS 有什么区别?

all

我知道 CSS Reset 是什么,但最近我听说了一个叫做 Normalize.css 的新东西

Normalize.cssReset
CSS
有什么区别?

规范化 CSS 和重置 CSS 有什么区别?

它只是 CSS 重置的一个新流行词吗?


阅读 172

收藏
2022-03-06

共1个答案

小编典典

我在 normalize.css 上工作。

主要区别在于:

  1. Normalize.css 保留有用的默认值,而不是“取消样式化”所有内容。 例如,在包含 normalize.css 之后,类似supsub“正常工作”的元素(实际上变得更加健壮),而在包含 reset.css 之后,它们在视觉上与普通文本没有区别。因此, normalize.css 不会强加给您一个视觉起点(同质性)。这可能不符合每个人的口味。最好的办法是对两者都进行试验,看看哪种凝胶符合您的喜好。

  2. Normalize.css 更正了一些超出 reset.css 范围的常见错误。 它比 reset.css 范围更广,还为常见问题提供了错误修复,例如:HTML5 元素的显示设置、font表单元素缺乏继承、更正font-size渲染pre、IE9 中的 SVG 溢出以及buttoniOS 中的样式错误。

  3. Normalize.css 不会弄乱您的开发工具。 使用 reset.css 时的一个常见问题是浏览器 CSS 调试工具中显示的大型继承链。由于有针对性的样式,这不是 normalize.css 的问题。

  4. Normalize.css 更加模块化。 该项目被分解为相对独立的部分,如果您知道您的网站永远不需要它们,您可以轻松地删除部分(如表单规范化)。

  5. Normalize.css 有更好的文档。 normalize.css 代码在GitHub Wiki中以内联方式和更全面的方式记录。这意味着您可以了解每行代码的作用、包含它的原因、浏览器之间的差异,并更轻松地运行您自己的测试。该项目旨在帮助人们了解浏览器默认如何呈现元素,并使他们更容易参与提交改进。

我在一篇关于 normalize.css的文章中对此进行了更详细的描述

2022-03-06