什么是栅格系统

一、概念

1、栅格系统（grid systems），也叫“网格系统”。栅格设计系统（又称网格设计系统、标准尺寸系统、程序版面设计、瑞士平面设计风格、国际主义平面设计风格），是一种平面设计的方法与风格。

2、栅格系统运用固定的格子设计版面布局，风格工整简洁。

二、网页栅格系统

1、概念：以规则的网格阵列来指导和规范网页中的版面布局以及信息分布。

2、优点：使用栅格设计，可以使网页的信息呈现更加美观易读，更具可用性。

3、原理：通过设置不同的n、i、A值划分网页的区块，实现标准化的灵活设计。

原理示意 灵活分割

4、局限性：对于内容信息不确定导致高度不确定的页面，在高度层面上就无法做到遵循栅格了。

三、经典960栅格

1、苹果下浏览器的默认宽度为960px。在 1024 x 768 的分辨率下，Firefox窗体的大小约为 974 x 650. 减掉左右两边7px的边框，为 960 x 650。可见设计师们都不约而同选择960px的页面宽度。

2、目前大部分大型门户网站的首页宽度为950px/960px。绝大多数显示器都支持 1024 x 768 及其以上分辨率，为了有效的利用屏幕宽度同时保证栅格的灵活度，960就成为网页栅格系统中的最佳宽度（可以实现较多组合）了。当然，随着分辨率的提高，以后可能会流行更高px的页面宽度。

——部分内容整理自网络——