欢迎来真孝善网,为您提供真孝善正能量书籍故事!

深入解析:Reset.css与Normalize.css的功能及其推荐理由

时间:11-08 现代故事 提交错误

reset.cssHTML 标签在浏览器中具有默认样式。例如,p 标签具有顶部和底部边距,strong 标签具有粗体字体样式,em 标签具有斜体字体样式。不同浏览器的默认样式也存在差异。例如,ul 默认具有缩进样式。在IE下,它的缩进是通过margin来实现的,而在Firefox下,它的缩进是通过padding来实现的。在切换页面时,浏览器的默认样式常常会给我们带来麻烦,影响开发效率。所以解决办法就是从一开始就去掉所有浏览器的默认样式,或者更准确地说,是通过重新定义标签样式。 “覆盖”浏览器的CSS 默认属性。最简单的方法就是覆盖浏览器提供的默认样式!这是CSS 重置。

normalize.cssNormalize.css 是CSS 重置的替代方案。 Normalize.css 只是一个小型CSS 文件,但它在默认HTML 元素的样式方面提供了高度的跨浏览器一致性。与传统的CSS 重置相比,Normalize.css 是为HTML5 准备的现代、高质量替代方案。 Normalize.css 现在用于Twitter Bootstrap、HTML5 Boilerplate、GOV.UK、Rdio、CSS Tricks 和许多其他框架、工具和网站。

Normalize vs Reset1. Normalize.Css 保护了有价值的默认值Reset 通过将默认样式应用于几乎所有元素,强制元素具有相同的视觉效果。相比之下,Normalize.css 保留了许多默认的浏览器样式。这意味着您不再需要重新设计所有常见的排版元素。当某个元素在不同浏览器中具有不同的默认值时,Normalize.css 会尽力保持这些样式一致并尽可能符合现代标准。

2. Normalize.Css 修复了浏览器的Bug它修复了常见的桌面和移动浏览器错误。这通常超出了Reset 的能力范围。在这方面,Normalize.css 修复的问题包括HTML5 元素的显示设置、预格式化文本的字体大小问题、IE9 中的SVG 溢出以及各种浏览器和操作系统中出现的许多与表单相关的问题。漏洞。

3. Normalize.Css 不会让你的调试工具变的杂乱使用Reset最麻烦的部分是浏览器调试工具中庞大的继承链。在Normalize.css中就不会有这样的问题。

4. Normalize.Css 是模块化的该项目已分为相关但独立的部分,可以轻松清晰地查看哪些元素设置为特定值。这允许您有选择地删除应用程序中永远不会使用的某些部分(例如表单的泛化)。

5. Normalize.Css 拥有详细的文档Normalize.css 的代码基于详细且全面的跨浏览器研究和测试。详细的代码描述可以在这个文件中找到,并在Github Wiki 中进一步解释。这意味着您可以准确地找出每一行代码的作用、编写原因、浏览器之间的差异,并且可以更轻松地进行自己的测试。

用户评论

拉扯

我最近在学习前端开发,经常看到这两个单词,想明白了他们分别是什么!

    有15位网友表示赞同!

残花为谁悲丶

我一直用的Bootstrap框架,感觉它自带了一些样式处理,所以没太理解这两种库的作用。

    有8位网友表示赞同!

别悲哀

以前都是直接写CSS吧,现在用这些库真的能提高效率吗?

    有15位网友表示赞同!

岁岁年年

我好奇两个库的区别在哪儿,什么时候该使用哪个比较好?

    有10位网友表示赞同!

命该如此

感觉用Normalize.css更安全点,毕竟浏览器之间的差异还挺大对吧!

    有8位网友表示赞同!

把孤独喂饱

学习web开发需要掌握不少工具和技术,这两种工具听起来也不太简单啊。

    有18位网友表示赞同!

嘲笑!

我一直在找一些提高网页开发效率的方法,这两个库看起来很不错。

    有7位网友表示赞同!

半梦半醒半疯癫

以前没接触过这些,想了解一下他们具体是如何修复浏览器差异的。

    有9位网友表示赞同!

ヅ她的身影若隐若现

学习web设计要不断尝试新技术,这两库也值得试试看!

    有16位网友表示赞同!

惦着脚尖摘太阳

刚开始写CSS的时候经常会遇到浏览器跨平台显示问题,这些库也许能解决这个问题?

    有12位网友表示赞同!

小清晰的声音

感觉Normalize.css的名字很有意思,它是不是真的能让我们网页样式标准化呢?

    有17位网友表示赞同!

在哪跌倒こ就在哪躺下

这个标题还挺直白清晰滴,我更容易理解你想表达的意思。

    有7位网友表示赞同!

┲﹊怅惘。

用reset.css和normalize.css会不会代码量增加好多呢?

    有9位网友表示赞同!

tina

平时写CSS感觉很痛苦,希望这些库能给我带来改变!

    有10位网友表示赞同!

青衫负雪

我想知道具体哪些浏览器差异需要这两个库来修复?

    有11位网友表示赞同!

猫腻

有没有什么简单易懂的学习资源可以推荐我吗?

    有19位网友表示赞同!

命里缺他

现在做前端开发真是越来越专业了,技术更新迭代速度太快!

    有13位网友表示赞同!

栀蓝

我觉得用这些库能让我更专注于页面设计本身,而不是纠结浏览器的兼容性问题。

    有11位网友表示赞同!

【深入解析:Reset.css与Normalize.css的功能及其推荐理由】相关文章:

1.蛤蟆讨媳妇【哈尼族民间故事】

2.米颠拜石

3.王羲之临池学书

4.清代敢于创新的“浓墨宰相”——刘墉

5.“巧取豪夺”的由来--米芾逸事

6.荒唐洁癖 惜砚如身(米芾逸事)

7.拜石为兄--米芾逸事

8.郑板桥轶事十则

9.王献之被公主抢亲后的悲惨人生

10.史上真实张三丰:在棺材中竟神奇复活