960gs tips

960gs tips

http://gridder.andreehansson.se/
学习360gs的必备文章，好
http://net.tutsplus.com/tutorials/html-css-techniques/mastering-the-960-grid-system/

http://www.biuuu.com/p973.html

Query插件960.gs grid overlay实现Javascript辅助布局页面功能

960 Grid [http://960.gs/]是一个非常优秀的用于辅助设计师进行快速创建网页原型的辅助系统，jQuery插件960.gs grid overlay是基于960 Grid 的原理上使用javascript实现辅助网页布局和设计的工具，使用非常简单，实例如下：

使用说明
需要使用jQuery库文件和960grid库文件

使用实例
一，包含文件部分

1. <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
2. <script type="text/javascript" src="jquery.960grid-1.0.min.js"></script>

二，Javascipt部分

1. <script type="text/javascript">
2. $(function() {
3. $("body").addGrid(12, {img_path: 'images/'});
4. });
5. </script>

addGrid()方法有两个参数，12表示格子数，img_path表示辅助图目录。
实例将产生一个960 Grid 的布局图，用于辅助网页设计和开发。

注意有两张辅助图：12_col.png和16_col.png

在线演示960.gs grid overlay
http://www.badlydrawntoy.com/static/960grid/

下载960.gs grid overlay源码包
http://jquerycodes.googlecode.com/files/jquery.960grid-1.0.zip

posted on 2011-08-24 15:36  lexus 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/lexus/archive/2011/08/24/2152087.html