4. 边距（Margin）

边距（Margin）是指界面内容到屏幕边缘的距离，主要用来控制核心内容的展示边界，所以是禁止放置任何内容的（部分浮窗、返回顶部按钮、右侧吸附边栏除外）。边距值的大小会直接影响到栅格区域空间，这点大家自行理解即可。

5. 栅格总宽（Container）

栅格总宽（Container）是指所有列加所有水槽再加上两侧边距的总和，即整个栅格系统的总宽度。

6. 容器盒子（Col-n）

容器盒子（Col-n）是指布局信息的版面区域，通常设计师在设定好基础栅格后，会根据实际情况去定义一块内容需占用几个列的宽度并形成容器，后续在设计过程中，会将文字、图片、按钮等元素约束在限定的容器宽度以内形成复用组件，最终组合拼装成完整的设计方案。

1. 设计栅格宽度

在设计Web端界面时设计师需要先根据实际使用场景确定好布局后，再来设定栅格区域，如下列布局：