html5中文学习网

您的位置: 首页 > CSS3技术 » 正文

真的还需要reset.css么?

[ ] 已经帮助:人解决问题

 我博客浏览量靠前的一直是《打造自己的reset.css》,jWxHTML5中文学习网 - HTML5先行者学习网

然而,我对此的观点也已经有所改变,jWxHTML5中文学习网 - HTML5先行者学习网
所以,我觉得是时候写一篇博客阐述一下目前我的理解了。jWxHTML5中文学习网 - HTML5先行者学习网
注意,这是篇激进的博文,其观点并不客观中立,仅仅表示出我目前的想法。jWxHTML5中文学习网 - HTML5先行者学习网

是否使用*{MARGIN:0;PADDING:0}

实际上,我现在根本不避讳*{margin:0;padding:0}这种写法了。jWxHTML5中文学习网 - HTML5先行者学习网
我从未看到过真正有关于这个对性能有影响的报告jWxHTML5中文学习网 - HTML5先行者学习网
也不觉得下面Eric的重置样式比起这玩意有多高明之处jWxHTML5中文学习网 - HTML5先行者学习网

CSS Code复制内容到剪贴板
  1. html, body, div, span, applet, object, iframe,  
  2. h1, h2, h3, h4, h5, h6, p, blockquote, pre,  
  3. a, abbr, acronym, address, big, cite, code,  
  4. del, dfn, em, font, img, ins, kbd, q, s, samp,  
  5. small, strike, strong, sub, sup, tt, var,  
  6. b, u, i, center,  
  7. dl, dt, dd, ol, ul, li,  
  8. fieldset, form, label, legend,  
  9. table, caption, tbody, tfoot, thead, tr, th, td {  
  10.     margin: 0;  
  11.     padding: 0;  
  12.     border: 0;  
  13.     outline: 0;  
  14.     font-size: 100%;  
  15.     vertical-alignbaselinebaseline;  
  16.     backgroundtransparent;  
  17. }  

上面的代码波及面一样很大,难道就不造成性能问题了?jWxHTML5中文学习网 - HTML5先行者学习网
到写具体元素样式代码的时候就不会因此受到reset.css的影响了?jWxHTML5中文学习网 - HTML5先行者学习网
扯淡!jWxHTML5中文学习网 - HTML5先行者学习网
现在回过头来看去年3月写的那篇博客《打造自己的reset.css》,jWxHTML5中文学习网 - HTML5先行者学习网
觉得有些想法是人云亦云,有些想法过于幼稚了。jWxHTML5中文学习网 - HTML5先行者学习网
另外找到了一篇博文支持我这种看法,可以看看jWxHTML5中文学习网 - HTML5先行者学习网
关于CSS RESET,关于*{margin:0;padding:0}jWxHTML5中文学习网 - HTML5先行者学习网

其他表现不同的元素

除此padding和margin之外,如果一个元素在不同浏览器内表现显著不同,jWxHTML5中文学习网 - HTML5先行者学习网
那何不直接在用到的那个页面写css呢?jWxHTML5中文学习网 - HTML5先行者学习网
何必为了少数元素的表现,写到全局的reset中呢?jWxHTML5中文学习网 - HTML5先行者学习网
实际上随着IE6的逐渐老去,这种差异已经越来越小了jWxHTML5中文学习网 - HTML5先行者学习网
而我们关心的依然是主流浏览器,IE6,IE7和IE8,这3个是绝对主流,jWxHTML5中文学习网 - HTML5先行者学习网
以及我们自己会用的Firefox和Chrome或者其他jWxHTML5中文学习网 - HTML5先行者学习网
那么只要这几个主流浏览器测试下来没问题,就没问题了,jWxHTML5中文学习网 - HTML5先行者学习网
有必要花成本关心其他更小众的浏览器么?jWxHTML5中文学习网 - HTML5先行者学习网

另外,我们实际中也很少对页面设计需要对任何元素精确到像素级的还原,jWxHTML5中文学习网 - HTML5先行者学习网
只要整体表现得当,个别元素的出格(更多的是跟操作系统有关)无伤大雅。jWxHTML5中文学习网 - HTML5先行者学习网
实际上我就没看到有人非得把表单按钮重置到让mac系统下的样子跟win下一样。jWxHTML5中文学习网 - HTML5先行者学习网

原汁原味的元素

很多元素浏览器默认样式就都一样(至少大致差不离),并且都很不错jWxHTML5中文学习网 - HTML5先行者学习网
比如 ins 和 del 这种,还有 strong 以及 em 这类。jWxHTML5中文学习网 - HTML5先行者学习网
默认样式不好么?如果到头来也不过就是让strong变成粗体,em变成斜体jWxHTML5中文学习网 - HTML5先行者学习网
那还不如不要重置呢。jWxHTML5中文学习网 - HTML5先行者学习网
如果有自己的想法呢,希望全局都一样呢?不如写 global.css 吧!jWxHTML5中文学习网 - HTML5先行者学习网

RESET.CSS VS GLOBAL.CSS

是的,很多网站都要追求全局的一些样式的统一,jWxHTML5中文学习网 - HTML5先行者学习网
为此要用reset.css重置一下,然后再用global.css来定义全局样式。jWxHTML5中文学习网 - HTML5先行者学习网
那我说,为何不直接用global.css取代reset.css的功能?jWxHTML5中文学习网 - HTML5先行者学习网
一样要定义,何不一步到位?jWxHTML5中文学习网 - HTML5先行者学习网
先重置,再定义,难道是带宽富余的没处用了?jWxHTML5中文学习网 - HTML5先行者学习网

举例来说,上面提到的 strong 和 em 元素。jWxHTML5中文学习网 - HTML5先行者学习网
如果希望全局都是加粗的斜体的,个别地方有其他样式,那自然无需重置样式jWxHTML5中文学习网 - HTML5先行者学习网
而如果全局都不要加粗斜体,有统一特殊的强调样式,那简单,直接在global.css里写就好了。jWxHTML5中文学习网 - HTML5先行者学习网
如果全局都不要加粗斜体,但不同地方有不同样式,那也简单,jWxHTML5中文学习网 - HTML5先行者学习网
在global.css写入重置样式,都变成正常字体即可,这就是取代了reset.css的功能了。jWxHTML5中文学习网 - HTML5先行者学习网

于是乎,目前我的观点是:reset.css这种先重置再定义的模式可以放弃了,一步到位,根据不同网站的特点编写不同的global.css,效果会更好。jWxHTML5中文学习网 - HTML5先行者学习网
所以,我很支持 No CSS ResetjWxHTML5中文学习网 - HTML5先行者学习网

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助