Reset CSS的前生今世

存在即合理。那么Reset CSS从无到有,到底有神马用处呢?

1. 先来说说Reset CSS的由来

话说很早很早以前,傲来国海外的一座岛上有一块石头……不对不对,那是西游记……

重来。

话说大伙儿还在中学埋头啃书的时候,即不远不近的2004年,一个专注于Web标准的帅哥Tantek被CSS的浏览器兼容问题搞烦了,他苦恼于各种浏览器自定标准,于是就想自己统一一下CSS以方便使用,于是乎就产生了undohtml.css

所以说,Reset CSS存在的理由,就是因为它消除了不同浏览器对HTML元素的默认CSS解释的差异性。比如 <ul></ul> 在IE6-8和FF下默认的缩进就不一样。

IE6-8中是margin-left:40px;padding-left:0,而FF中是margin-left:0;padding-left:40px

2. Reset CSS的工作原理

其实Reset CSS的工作原理非常之简单啦。

就是写一个reset.css文件,在里面将HTML元素的一些style定义一次,然后在网页中引入这个reset.css文件就可以了。

有了这个reset.css,各个浏览器在解析CSS的时候就会遵循reset.css中统一的style定义,于是这个世界就清净了。

3. 实现方式

具体的实现方式请移步:打造自己的reset.css,作者写得非常好,我就不做重复性的劳动了。

这里给出YUI的reset.css让大家先睹为快吧:

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:”; } abbr,acronym { border:0; }

4. 其他的声音

什么东西使用过度都是不对的。

对于Reset CSS的使用也有了很多反对的声音。

比如”打造自己的reset.css“的作者自己后来又写了一篇文章:”真的还需要reset.css么?“。

其实到底用不用Reset CSS,也是个见仁见智的问题,不能一概而论。

NB的Eric对于反对使用Reset CSS的回应是:

Because this isn’t a field of straightforward answers and universal solutions.We are often faced with problems that have multiple solutions, none of them perfect.

To understand what makes each solution imperfect and to know which of them is the best choice in the situation—that’s knowing your craft.

That’s being a craftsman/craftswoman. It’s a never-ending process that is all the more critical precisely because it is never-ending.

我个人的意见是:

  • 新手请用reset.css。优点是消除学习初期很多你觉得莫名其妙的bug,可以让你专注于你学习的东西而不是成天debug;缺点是没有这些debug的工作,你会少学很多知识。不过总的来说学习是个循序渐进的过程,所以还是推荐新手使用 reset.css。
  • 老手就不要直接使用reset.css了,而是应该直接根据项目的需要,设定好全局的CSS。

那么你对Reset CSS的看法是什么呢?用,还是不用?或者怎样使用呢?

欢迎大家发表自己意见 & 贴出自己使用的reset.css~

原文地址:http://www.fancycedar.info/2011/04/reset-css/

喜欢这篇文章?

欢迎订阅 PureWeber.com - 纯粹互联网。接收免费的更新提醒,以及订阅读者独家优质内容。

讨论

  1. kacoro 回复

    我是新手~很需要用…呵呵。

加入讨论

电子邮件地址不会被公开。 必填项已用*标注