是将一个css框架的reset部分精简了一下(其实精简了很多),使用基本无问题
/*reset*/ /** * @section CSS-Normalisation Module */ /* (en) Global reset of paddings and margins for all HTML elements */ * { margin:0; padding:0; } li { list-style:none;} body { /* (en) Fix for rounding errors when scaling font sizes in older versions of Opera browser */ font-size:100%; /* (en) Standard values for colors and text alignment */ background:#fff; color:#000; text-align:left; /* LTR */ } /* (en) Clear borders for <fieldset> and <img> elements */ fieldset, img { border:0 solid; } table { border-collapse: collapse; border-spacing: 0; } /*reset end*/ html,body { height:100%; } body { font-family:Arial,宋体, 微软雅黑; } a { outline:none; *blr:expression(this.onFocus=this.blur()); /*去掉a标签的边框(兼容古代浏览器)*/ }
注意“reset end”位置
2013-12-18
现在网上比较流行的观点是说用 * { margin:0; padding:0; } 过于简单,性能消耗大
我本来觉得*的性能问题应该不是很大,且应该由浏览器去解决(既然定义了这个语法,不就是给人用的么),但浏览器的世界比较扭曲,实际上reset的存在本身就是这种扭曲存在的证明,话说如果大家的标准一致,根本不需要reset代码了。另一方面*确实有点一棍子打死所有标签的感觉,好处是有新的标签,不用再加了,坏处是有的标签不需要被reset(此样式对其无意义/此样式对其不太建议),于是网上有一套比较抠细节的方案
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ 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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border:0 solid; }/*自己加的*/
有的人说要打造自己的reset,有的人说高手根本不需要reset,说的都很有道理,但如果你不想陷入浏览器css细节海洋的话,先找一个好的reset,理解它并且适应它,尽可能的用标准的方式使用html和css代码,基本上在各个浏览器上的表现差异不会太大(ie6,7确实需要额外的工作),而这不就是我们的目的所在么,找这方面资料的时候看到过一句话说的很贴切,暂时找不到了,以后补上