Reset CSS(CSS初始化)总结


市面上浏览器众多,各种浏览器对标签默认属性值的定义不尽相同。

那如何保持CSS在每个浏览器上的显示效果相同呢?这就涉及到了CSS初始化的问题。

熟话说,先破后立。CSS初始化的思想就是先把所有的默认值置为相同的,再把有需要的改成需要的值,这样所有浏览器的显示效果都会相同。但是CSS能控制的东西太多,如果这样写:

这样。。。简单是简单,但是一方面占用系统资源太大,另一方面,你把不需要置为0的标签也变成0了,这样后期使用的时候你还得一个一个的补回来。所以现在几乎没人会用这样的设置了。

我在网上找了一个前Yahoo前端工程师的CSS Reset和一个个人的CSS Reset,两个各有优缺点,先放在这里,以备后用。

Yahoo CSS Reset:

Li Css Reset:

可以到我的GitHub的CSS项目下面下载。

关于CSS Reset的讨论我在知乎上看到一个帖子,讨论Normalize.css 与传统的 CSS Reset 有哪些区别?

上面说到:

Normalize.css 是改良派。他们提倡,各个元素都有其存在的道理,简单粗暴地一视同仁是不好的。body 那一圈确实挤压了页面的生存空间,那就改掉。士农工商,谁有谁的作用,给他们制定个规范,确保他们在任何浏览器里都干好自己的活儿。

这确实有道理,任何事情都不能一棒子打死,存在即合理。

我稍微看了一下Normalize.css,几乎把每个标签都重写了一遍,虽然内容很多,但是确实在使用的时候可以安心的使用标签本来的特性了。

Normalize.css我也Fork了一份到我的Github上面,就不发在这里了,欢迎点击查看和下载

声明:疯人峰语|版权所有,违者必究|如未注明,均为原创|本网站采用BY-NC-SA协议进行授权

转载:转载请注明原文链接 - Reset CSS(CSS初始化)总结


做你想做的,不必管别人