目标10——第三方框架：Blueprint

           由于 HTML 是一种标准，并且所描述的是结构而非样式，因此 Blueprint 框架是完全作为 CSS 实现的。要使用 Blueprint，您在设计网页时要以 Blueprint 为指导，然后再设计或生成 HTML，以便将 Blueprint CSS 样式应用于 HTML 元素。实际上，由于 Blueprint 提供了强大的 CSS，因此您可以在 HTML 中设计网页，而不必使用图像设计程序来模拟最终页面，比如说 photoshop。从一定意义上说，Blueprint 提供了真正的所见即所得的（WYSIWYG）网页设计，因为您的原型将使用与最终站点相同的代码。

1、介绍

分而治之：

            buleprint在功能组织上，将诸如布局(layout)、排版(typography)、组件（widget）、重置（reset）、打印 (print)等功能分散到不同的css文件中。这样方便使用者只需要导入自己所要使用的功能，不用导入全部文件，提高页面装载性能。目前在组件部分只提供了对button的处理，尚未做到麦肯锡的MECE（"相互独立，完全穷尽"）的道。

统一接口

尽管功能分散到多个css文件，但是导入时候，仍然只需要包含同样的文件screen.css文件，具体的导入细节在screen.css中再处理，统一了对外接口。

<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection" />

blueprint 所包含的css文件说明：

screen.css

This is the main file of the framework. It imports other CSS files from the "lib" directory, and should be included on every page.

类似于Jeff Croft的base.css功能，只需要包含此文件，就可以导入

print.css

This file sets some default print rules, so that printed versions included on every page.

用于处理打印，可以归类为widget。

lib/grid.css

This file sets up the grid (it's true). It has a lot of classes you apply to divs to set up any sort of column-based grid.

用于处理页面的布局（栏目）

lib/typography.css
This file sets some default typography. It also has a few methods for some really fancy stuff to do with your text.

用于处理页面元素的排版。

lib/reset.css

This file resets CSS values that browsers tend to set for you.

用于重置页面，对没有指定css属性的页面元素指定缺省值。

lib/buttons.css
Provides some great CSS-only buttons.

用于处理按钮,可以归类为widget

lib/compressed.css

A compressed version of the core files. Use this on every live site.

See screen.css for instructions

提供压缩过的（包含grid.css,tyopgraphy.css,reset.css,buttons.css）的css文件。