960网格系统学习

960网格系统官方网站 http://960.gs
上面有个download 进行下载 里面有各种有用
(什么ps插件 模板 pdf 下载文档 反正960要用到的 她全有)
1)安装ps 的 960插件
ps 里 菜单=>窗口=>动作 alt+f9  打开动作面板
 按住960插件 左键拖到动作面板
2)选中12 Column Grid 点击动作面板上的播放选定的动作
3)高度为700不够用  我们常常通过菜单=>画布大小 (alt+ctrl+c)
(当然 宽度 也可以加)
4)选中960网格的图层 ctrl+t拉伸图层
在此过程中 我们可以 ctrl+0适应图层
5)弄好960的ps 初始化后
点矩形工具 选一颜色 画一矩形  接着再画几个矩形
6)960_12_col.css 这个就不用解释了
reset.css 重置了默认的样式  是为了浏览器的统一
text.css文本的样式
960.css 是包含12,16栏的样式
*_rtl.css 是 某些语言是从右到左的样式 我们用不到
我这里 用到三个css   960_12_col.css reset.css text.css
7)alpha 去掉左边距  omega去掉右边距
grid嵌套布局  最左边是  class 加上 alpha  最右边 classs 加上 omega
8)里面的样式 比如定义宽度 padding等  一般 我们在grid里面添加个div 实现这种效果
9)如果 宽度高于960的话 我们就把在 class为 container_12 的 div外面再加个 div
10) class 为 prefix_2 左边空出两个网格 padding-left:160px; suffix_2 右边空出两个网格padding-right:160px;
pull_2 表示left:-160px;position:relative;    push_2 表示left:160px;position:relative;
已全部看完