
Eric Meyer’s “Reset CSS” 2.0
Eric Meyer的Reset CSS 2.0帮助开发者减少浏览器默认样式差异,提供一个统一的起点,适合自定义调整。
介绍
嘿,你有没有在网页设计中遇到过不同浏览器之间的样式差异问题?比如说,标题的默认行高、边距、字体大小等等,总是让人头疼。别担心,Eric Meyer的“Reset CSS” 2.0就是为了解决这些问题而生的。
什么是Reset CSS?
简单来说,Reset CSS的目标就是减少浏览器在默认样式上的不一致性。Eric Meyer在2007年就讨论过这个问题,而他的重置样式也被广泛应用于各种CSS框架中,比如Blueprint。这个重置样式表非常通用,比如说它并没有为body元素设置默认颜色或背景。也就是说,你不应该直接在项目中原封不动地使用它,而是应该根据自己的需求进行调整和扩展。
如何使用Eric Meyer的Reset CSS?
首先,你可以在Eric Meyer的网站上,然后根据自己的项目需求进行修改。它是完全公开的,所以你可以随意使用和调整。
下面是Reset CSS 2.0的一些关键点:
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;
}
这些代码行将所有常见的HTML元素的边距、填充和边框重置为零,并设置字体继承和垂直对齐为基线。
为什么要使用Reset CSS?
使用Reset CSS的好处在于它提供了一个统一的起点。通过消除浏览器默认样式的差异,你可以更轻松地控制网页的外观。这样一来,你就可以专注于设计本身,而不是为了解决不同浏览器的样式问题而烦恼。
结语
在我看来,Eric Meyer的Reset CSS 2.0是一个非常实用的工具,特别是对于那些希望在不同浏览器中保持一致样式的开发者来说。你可以根据自己的项目需求进行调整和扩展,这样就能更好地控制网页的设计和布局。试试看,你会发现它的妙处。
上一篇已经是第一篇
下一篇Normalize