960GridSystem(960gs)是一个专为简化网页UI设计工作流程而设计的宽度为960像素的布局工具，提供12列和16列两种版本。通过使用container_12和container_16创建页面布局，同时借助grid_*、clear、push_*、pull_*、prefix_*、suffix_*、alpha和omega等类来灵活调整元素位置和间距。本文深入探讨了960GS的使用方法及限制。
960 Grid System(960gs)是一个为了简化webUI设计工作流程而出现的宽度为960像素的工具。它包含两个版本，12列和16列，这两个版本可以单独使用也可以放一起使用。
- container_12和container_16，用于最外层的div，它们确定页面采用12列布局还是16列布局。
- grid_*，代表n列宽。12列对应1～12，16列对应1～16。使用时，一行内的grid数值之和等于container数值。
- clear，清除上一行的样式，一般在分行时使用。
- push_*和pull_*，将div往内推或往外拉n列宽。
- prefix_*和suffix_*，在div的前后留n列宽空白。
- alpha和omega，分别应用到内嵌表格的第一个和最后一个，其目的是为了去掉表格之间的空白。因为框住内嵌表格的外部表格本身已经有了自己与其他表格之间的空白，因此内嵌表格和外部表格之间的空白一般是不美观，不必要的。
在使用时需注意960 GS的限制：
- 页面的宽度限制为960px。
- 上述class只限定了div的宽度，高度由开发者自行控制。
- 只提供了12列、16列和24列布局。
- 功能单一，只聚焦简化布局。
扫一扫
356
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
