WEB标准之CSS 打造自己的reset.css
2024-07-11 08:26:43
供稿：网友
0，引言
每每有新项目，第一步就是应当使用一个reset.css来重置样式。滥用不如不用，直接拿个现成的reset.css过来将导致后期各种离奇bug的发生。
所以最好还是自己写一个reset.css，并且要明白每一条 reset都是用来做什么的。
reset.css本意就是重置样式，我始终建议把.clearfix放入layout.css,而把h1、h2之类的定义放进typography.css。
具体如何规划网站CSS结构，不在文本讨论之列，可以参考Smashing Magazine上的文章，国内有差强人意的中文译版。
注意，本文把reset分成了两个部分，一个是纯reset.css，可以用于任何项目。另一个是用于特定项目的“reset”，自定义修改的内容，这 些内容可以放在layout.css、typography.css之类的文件中，他们共同导入到一个base.css形成一个项目的基础样式。
本文就是来介绍如何写一个合适所有项目的通用的reset.css，以及介绍在设置玩reset.css之后需要针对不同项目要首先要设置的内容。
1，基础
牛顿是站在巨人伽利略的肩膀上的，我们也可以这么做。首先我们要选定一个前进的基础。
请永远不要使用
* { margin: 0; padding: 0; }
这问题太多了，在此不多加表述。
目前比较流行的有Eric Meyer的重置样式和YUI的重置样式。另有Condensed Meyer Reset简化Eric Meyer的样式。有趣的是，Eric的重置样式也是源于YUI的。而那份简化版又把Eric的样式简化回YUI的样式了 。但同时，糟糕的是，网上流传的比较广的(尤其是国内)都不是最新的版本。
上面两个页面里直接看到的都不是最新的，Eric专门为有 一个reset.css页面。而YUI当前版本(2.7.0)的reset.css实际地址里，比上面的页面中还多一些东西。此外，我们还可以基于一些常 见的框架，比较著名的比如Blueprint或者Elements CSS Framework（这个的reset也是源自于Eric Meyer的）。
OK，准备工作就差不多了。以上这些都可以作为参考资料来组织我们自己的reset。我这里主要采用YUI，兼带Eric的reset。
2，默认色彩
对于页面是不是有默认背景色和前景色，YUI和Eric有着不同的看法。
YUI重置背景色为白色而文字颜色为黑色。
html {
color: #000;
background: #FFF;
}
而Eric在当前最新版中让所有颜色为透明，他认为透明才是最原始的颜色。虽然他曾一度认为也应当设置白色背景色、黑色文字颜色。至于最后为什么改了，Eric并没有给出具体理由。
这个问题我基本认为是用户自定义的更重要还是你的设计更重要的问题。我个人的观点是，如果你的设计本身就是白色背景，那么不要设置背景。一小部分中高水平的用户，他们会自定义网页默认背景色。
