我博客浏览量靠前的一直是《打造自己的reset.css》,
然而,我对此的观点也已经有所改变,
所以,我觉得是时候写一篇博客阐述一下目前我的理解了。
注意,这是篇激进的博文,其观点并不客观中立,仅仅表示出我目前的想法。
是否使用*{MARGIN:0;PADDING:0}
实际上,我现在根本不避讳*{margin:0;padding:0}这种写法了。
我从未看到过真正有关于这个对性能有影响的报告
也不觉得下面Eric的重置样式比起这玩意有多高明之处
- html, body, div, span, applet, object, iframe,
- h1, h2, h3, h4, h5, h6, p, blockquote, pre,
- a, abbr, acronym, address, big, cite, code,
- del, dfn, em, font, img, ins, kbd, q, s, samp,
- small, strike, strong, sub, sup, tt, var,
- b, u, i, center,
- dl, dt, dd, ol, ul, li,
- fieldset, form, label, legend,
- table, caption, tbody, tfoot, thead, tr, th, td {
- margin: 0;
- padding: 0;
- border: 0;
- outline: 0;
- font-size: 100%;
- vertical-align: baselinebaseline;
- background: transparent;
- }
上面的代码波及面一样很大,难道就不造成性能问题了?
到写具体元素样式代码的时候就不会因此受到reset.css的影响了?
扯淡!
现在回过头来看去年3月写的那篇博客《打造自己的reset.css》,
觉得有些想法是人云亦云,有些想法过于幼稚了。
另外找到了一篇博文支持我这种看法,可以看看
关于CSS RESET,关于*{margin:0;padding:0}
其他表现不同的元素
除此padding和margin之外,如果一个元素在不同浏览器内表现显著不同,
那何不直接在用到的那个页面写css呢?
何必为了少数元素的表现,写到全局的reset中呢?
实际上随着IE6的逐渐老去,这种差异已经越来越小了
而我们关心的依然是主流浏览器,IE6,IE7和IE8,这3个是绝对主流,
以及我们自己会用的Firefox和Chrome或者其他
那么只要这几个主流浏览器测试下来没问题,就没问题了,
有必要花成本关心其他更小众的浏览器么?
另外,我们实际中也很少对页面设计需要对任何元素精确到像素级的还原,
只要整体表现得当,个别元素的出格(更多的是跟操作系统有关)无伤大雅。
实际上我就没看到有人非得把表单按钮重置到让mac系统下的样子跟win下一样。
原汁原味的元素
很多元素浏览器默认样式就都一样(至少大致差不离),并且都很不错
比如 ins 和 del 这种,还有 strong 以及 em 这类。
默认样式不好么?如果到头来也不过就是让strong变成粗体,em变成斜体
那还不如不要重置呢。
如果有自己的想法呢,希望全局都一样呢?不如写 global.css 吧!
RESET.CSS VS GLOBAL.CSS
是的,很多网站都要追求全局的一些样式的统一,
为此要用reset.css重置一下,然后再用global.css来定义全局样式。
那我说,为何不直接用global.css取代reset.css的功能?
一样要定义,何不一步到位?
先重置,再定义,难道是带宽富余的没处用了?
举例来说,上面提到的 strong 和 em 元素。
如果希望全局都是加粗的斜体的,个别地方有其他样式,那自然无需重置样式
而如果全局都不要加粗斜体,有统一特殊的强调样式,那简单,直接在global.css里写就好了。
如果全局都不要加粗斜体,但不同地方有不同样式,那也简单,
在global.css写入重置样式,都变成正常字体即可,这就是取代了reset.css的功能了。
于是乎,目前我的观点是:reset.css这种先重置再定义的模式可以放弃了,一步到位,根据不同网站的特点编写不同的global.css,效果会更好。
所以,我很支持 No CSS Reset