splitpane如何设置竖条的宽度_如何利用栅格快速搭建网页结构

在我们平常做网页设计，最常用得到的就是栅格系统，说到栅格系统，

什么是栅格系统？

栅格系统英文为“grid systems”，也有人翻译为“网格系统”，运用固定的格子设计版面布局，其风格工整简洁，在二战后大受欢迎，已成为今日出版物设计的主流风格之一。

栅格系统的设计原理及应用

那么如何设计一个栅格系统？接下来我们将通过实例，详细的介绍一下网页栅格系统的原理与应用：

在网页设计中，我们把宽度为“W”的页面分割成n个网格单元“a”，每个单元与单元之间的间隙设为“i”,此时我们把“a+i”定义“A”。他们之间的关系如下：

W =（a×n）+（n-1）i

由于a+i=A，

可得：(A×n) – i = W

[1]

栅格系统的使用步骤

1. 确定内容的总宽度W（常用的1180px、1190px、1200px、1400px）
2. 确定栅格数目n（如果你的网页结构相对简单，则n=12即可，如果网页结构比较复杂或者具有排版的不确定性，则用n=24。）
3. 确定水槽的宽度i࿰