There are printable sketch sheets, design layouts, and a CSS file that have identical measurements.

960 gs 包括带格子的草图pdf（打印出来，讨论原型设计的时候可以显得更专业一些），设计模板（带格子的ps,fireworks等作图软件的模板文件）以及一个css grid (格子)排版规范。960gs 推荐用 Adapt.js 检测浏览器宽度，加载响应的 css

var ADAPT_CONFIG = {
  path: 'assets/css/',

  // false = Only run once, when page first loads.
  // true = Change on window resize and page tilt.
  dynamic: true,

  // Optional callback... myCallback(i, width)
  callback: myCallback,

  range: [
    '0px    to 760px  = mobile.css',
    '760px  to 980px  = 720.css',
    '980px  to 1280px = 960.css',
    '1280px to 1600px = 1200.css',
    '1600px to 1920px = 1560.css',
    '1940px to 2540px = 1920.css',
    '2540px           = 2520.css'
  ]
};

960gs css 规范部分

• 最外面的容器 class=”container_12” 表示12列布局 container_16 表示16列 依次类推 24

• 用 reset.css 来初始化。但现在最流行的应该是 normalize.css，好处如下：

  • Preserve useful browser defaults rather than erasing them.尽量保留那些有用的浏览器样式
  • Normalize styles for a wide range of HTML elements.支持更多html 标签
  • Correct bugs and common browser inconsistencies.修正了一些bug
  • Improve usability with subtle improvements. 提升了易用性
  • Explain the code using comments and detailed documentation.有详细说明

• 用 class＝”grid_12” 表示自己宽度为 12列；grid_3 为3列 （内部格子数相加 = 外面容器总数）…

• class=”grid_1 prefix_1 suffix_10” 表示自己1列，前面空出 1 列 ，后面空出 10 列（内容独占一行）
• 默认都带 10px 左右margin，去掉前面用 alpha 后面 omega
• push_N 左边距离 N列；pull_M 右边距离 M 列(position:relative 所以内容可重叠)

小结：bootstrap 的 css grid 基于960gs，但更合理一些：相对宽度，responsive 等。