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-align:?baselinebaseline;??
  16. ????background:?transparent;??
  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先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助