按照Jeff Croft的Frameworks for Designers(或中文版本 理解Web框架,和如何构建一个CSS框架)描述的如何构建一个css framework的方法:
There are several possible ways to go about building a framework, but the most common and arguably the most useful is to abstract your common CSS into individual stylesheets that each cover a particular part of the whole. For example, you may have a stylesheet that sets up the typography and another that handles the mass reset. The beauty of the approach is the ability to selectively include only the styles that you need. You may end up with six or seven different stylesheets in your framework, but if a particular project doesn’t need one or two of them, they don’t have to be included. The framework we created in our office has five stylesheets:.
reset.css—handles the mass reset.
type.css—handles the typography.
grid.css—handles the layout grid.
widgets.css—handles widgets like tabs, drop-down menus, and “read more” buttons.
base.css—includes all the other stylesheets, so that we only need to call base.css from our (X)HTML documents to use the entire framework.
为何要reset
The basic reason is that all browsers have presentation defaults, but no browsers have the same defaults. (Okay, no two browser families—most Gecko-based browsers do have the same defaults.)
For example, some browsers indent unordered and ordered lists with left margins, whereas others use left padding. In past years, we tackled these inconsistencies on a case-by-case basis;