960 grid css web框架

960 grid css web框架。或许不能称作框架。

官方网站：http://960.gs/

因为：

960px=12(60pz+20px)=16x(40px+20px)=24(30px+10px)

所以：

960个像素作12栏 16栏 24栏分割

12栏和16栏分割的每个grid左右margin各10px，24栏分割每个grid左右margin各5px。

几个重要的关键字和概念

1.container容器：960px的宽度，左右margin auto 居中。

2.grid_x x方格：最小方格宽度*x px宽度+左margin 10px+右margin 10px（24栏布局分别为5px）

3.prefix_x前间距：使用padding属性。让grid和前面保持（最小方格宽度+间距）*x的距离.(例如 12栏的 prefix_3 的前间距为 （60px+20px）*3 即向前隔开三个方格的距离 )。

4.suffix_x 后间距：同理prefix_x,向后隔开x个方格。

5.pull_x 向左推：在正常的布局下向左推x个方格。

6.push_x 向右推：在正常的布局下向右推x个方格。

7.alpha 清除前间距：清除使用该class方格的前间距，方格会自动全部向前。

8.omega 清楚后间距：清除使用该class方格的后间距。

7.clear 换行（或者这样说有不妥）：重新换行继续方格布局。

心得：container 容器一定要外包在所有的grid布局的外面。它就像一页纸一样，我们可以在内部写方格。grid_x控制方格的宽度，prefix_x suffix_x控制方格间距，pull_x push_x控制方格左右浮动，alpha omega 清除左右的margin。clear 换行。

所以呢，可以理解为就是类似于在container内用方格写字就好啦！