• 集成了BluePrint & Tripoli 框架的做好的部分；
• Hartija 的打印样式；
• 960.gs的简洁；
• Elements 图标

作者想以此为你提供一个好用的样式集合和一个制作网站的通用的方法。这样你就可以集中精力搞设计了。

BlueTrip的一些特性:

• 24列网格
• 形象的布局样式
• 简洁的表单样式
• 一个打印样式
• 一个空的开始样式表
• 时髦按钮
• 状态信息样式

想实际看看这个框架吗？看一下demo吧.

PS:神飞之前基于960CSS发布了改良版本的Sparkle CSS框架，而且一直计划搞个Print样式，但是一直delay，最终也没有实施，现在好了这个框架可以完全实现我需要的功能了。

最近，blueprint发布了0.9版本，相对于0.8版，有比较大的改进：

• 改进forms.css，增加CSS选择器标签的使用，比如input标签，这样可以避免使用.text/.button等样式，可以减少样式class的数量。如果你已经无视了IE6的话，可以选择摈弃这些类——当然，blueprint也保留了.text/.button等样式。
• 修改IE条件注释条件为[if lt IE8]，而不再针对所有的IE浏览器，因为IE8对CSS2.1的支持已经非常棒了。

具体的改变如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

input[type=text],
input.text, input.title, 
textarea, select { 
  background-color:#fff; 
  border:1px solid #bbb; 
}
input[type=text]:focus, 
input.text:focus, input.title:focus, 
textarea:focus, select:focus { 
  border-color:#666; 
}
 
input[type=text], 
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}
 
input.text, 
input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }
 
input[type=checkbox], input[type=radio], 
input.checkbox, input.radio { 
  position:relative; top:.25em; 
}

这是一个增强的版本，所以我们强烈推荐更新至这个新版本。另外，为了简化HTML代码，大家也可以考虑使用jquery或mootools等JS框架的选择器来为IE6动态的添加相关样式。

blueprint官方网站 | 下载blueprint 0.9

BANGD007C31FD0CB5559CF12FD62XIANGUO

访问官网 | 下载

Goden Grid Demo - 6 columns

Golden Grid Demos

• grid system(6 column)
• grid system (12 column)
• grid system
• grid system(most common images and video ratios)
• grid system columns
• grid system visual tutorial

官方简介：
Emastic 是一个CSS框架，它将持续任务是：探索未知的新世界，寻找新的生活和新的网络空白，大胆发现CSS框架没有到达的地方。

emastic的优点：

* 轻量级 (压缩后小于4kb)
* 个性化宽度(em,px,%)
* 在网格中使用固定的或非固定的列
* Elastic使用”em”布局

Beta3更新:

* percent-grid.css (Plugin)
* absolute-grid.css (Plugin)
* semantic.css (Plugin)

Beta2更新:

* gadgets.css (Plugin)
* 垂直间距
* 改良排版 (基于网格)

官方网站：http://code.google.com/p/emastic/

本文在翻译原文的基础上，又添加了两个工具。初学者资源

YAML Builder – 简单易用的 YAML （Yet Another Multicolumn Layout – 做栏布局）XHTML/CSS 站点布局。(事实上，YAML是一个非常著名的CSS框架)
YUI Builder – Made by Yahoo，是YUI框架的一部分，类似于YAML，可以在线生成网页的CSS结构框架。
Sky CSS Tool – JavaScript CSS 工具
The Box Office – 文字围绕图片的 CSS 格式工具
CSSTXT – 在线 CSS 文字式样生成器

izzyMenu.com – 免费 CSS 菜单

pForm – HTML 表单生成工具

Roxer – 拖放式网站设计工具

Wirenode – 创建移动站点

doodlekit – 在线网站设计及 CMS 系统，含表单生成器，Paypal 构物车，可互换的布局与图片，内置图片库

dotemplate – 可定制的网站模板

templatr – 创建网站模板的在线工具

Agency of Record – 面向创意设计者的网站设计与托管平台。

Typechart – 字样与 CSS 式样

CSS Type Set – 创建个性化 CSS 字体式样

CSSType – 试验各种 Web 安全的排版风格并获得相应 CSS

CSS Builder – 快速生成 CSS

Firdamatic – 不使用 table 设计2或3栏博客版面

PsycHo – 博客模板设计

folionow – 简单易用用便宜的网站设计工具

CSStxt – 自定义 CSS 文字式样

Viviti – 易用的网站设计工具

ComfyPage – 简单易用的免费网站设计工具，可定制模板，并添加任意多页面

LetsEat.at – Free website builder and hosting for restaurants that includes customizable menus, daily specials, printable coupons, and more.用于酒店宾馆的免费网站设计工具。包含可定制的菜单，每日特价，优惠券等。

webon – 免费的，不含广告的网站设计工具，可用来设计博客，像册，视频站

infogami – 快速设计网站，含可定制的模板。

edicy – 创建网站，并使用你自己的域名上线

Jimdo – 网站创建工具，集成了各种图片，视频等

Webnode – 免费创建个人或公司网站，拖放式操作，标签，免费托管

iompi – 创建电子商务网站

easysite.com – 网站创建工具，含照片，视频，博客，免费电话支持

myfamily.com – 免费的，不限空间的家庭网站创建

MomentVille – 免费婚礼网站创建工具

SeeYouThen! – 婚礼网站创建工具，含高分辨率照片交换，私人消息，客人资料等

GoHoster – 支持子域名的免费网站创建工具

BlinkWeb – 免费的拖放式网站设计工具，含电子商务选项

Macrocasa – 房地产行业网站创建工具，包含中介消息系统及客户管理系统

Pixie – 免费的，开源网站创建工具，含直观的界面，容易安装部署

Squarespace – 一个强大网站创建工具，含 XHTML 验证，所见即所得编辑器，博客平台。

NicEdit – 跨平台内容编辑器，可以在浏览器中直接编辑网站内容

WordPress Theme Generator – 使用该工具你可以创建完全定制化的 WordPress 主题

高级专业设计者资源

CSS Superdouche – 净化 CSS 以降低其复杂性

Code Beautifier – CSS 代码格式与优化

CSSFly – 在浏览器中编辑 CSS 和 XHTML

CSS Drive CSS Compressor – CSS 压缩工具

Clean CSS – CSS 净化与优化工具

CSS整理与优化工具 – 国内著名的css整理与优化工具。

EM Calculator – 将基于 px 的尺寸转换为 em

CSS Redundancy Checker – 清除未使用 CSS 选择器，检查 CSS 中多余代码

GrayBit – 将彩色网站转换成灰度级以测试其可访问性

ProtoShare – 创建网站模型，从团队获取反馈，创意与建议

Most Sliced – 图片切片服务列表，含评测与用户评分

Inserit – 一个用于 Web 设计师的 CMS 系统

LightCMS – CMS 系统

clickbooq – 网站创建与管理工具

jumpchart – 网站规划程序，可输出干净的 CSS/XHTML

inblogit – 博客工具，可以集成到任何网站

Reflect – 网站设计与托管平台

Carbonmade – 让设计者们在线展示自己的作品

ThemesPress – 将 Template 文件转换成 WordPress 主题

Feng GUI – 这是一个很有趣的工具，它模拟人类在5秒钟内看到一个网页画面时的印象，分析你网页中最容易被人注意的热点位置。

Text Generator – Lorem Ipsum 傀儡文字的替用品

webvanta – 商业网站创建与托管

Tuplix – 直接在网页上更改内容

FolioSnap – 创意设计者用来展示作品的工具

Frontfriend – 供网站设计者使用 CMS 系统，可以创建表单和模板，供最终客户填写

PS：来源：http://mashable.com/2008/11/05/web-design-toolbox/

但是本文根据个人经验有多添加了两个。