网页栅格系统研究:蛋糕的切法（2）
作者：玉伯 来源：Taobao.com UI Team 发布时间：2008-10-24 17:07:00
标签：网页栅格,栅格,屏幕,布局,设计
950的来历
具体应用时，Margin其实是一个空白边，从视觉上看并不属于总宽度。不少栅格设计里习惯性地设定Gutter为10px, 这样Margin就是5px. 当W为960，分割成6列时，栅格如下图：
上图的处理是左右Margin各为5px. 也可以将Margin集中放在一边，比如右边：
无论Margin放在何处（这只影响技术实现，不影响设计），我们真正要关注的是去除Margin之后的部分：
这就是我们要真正关注的950！将W的含义变为去除Margin的总宽度，公式变化为：
W = N * C - g
将上面的公式实例化一下：
950 = 12 * 80 - 10
950 = 16 * 60 - 10
950 = 24 * 40 - 10
这就形成了960蛋糕的三种常见切法。
12 x 80
16 x 60
24 x 40
0
投稿猜你喜欢
- 有时会被问到“看看XXX网站如何？”之类的问题。谈到评估，通常都是指产品级的网站，如果模式很新，了解需要花一定时间。于是，很多人又问“那么你
- '====================================='功能:根据ip地址输出地区'参数:ip
- 没人愿意等待。所以，没有访问者真的能够忍受一个打开速度极慢的网站。但是，网页打开速度到底对用户行为有什么影响，恐怕没几个人能够说清楚吧。前几
- 分析当前用户下所有表的记录总数保证好用！begin dbms_utility.analyze_schema(user,'COMPUT
- 这篇论坛文章（赛迪网技术社区）主要介绍了配置一个高可用性的MySQL服务器负载均衡群集的具体过程，详细内容请参考下文：本文将告诉你如何配置一
今天在看罗素的《西方哲学史》时，忽然想到了这个想法，我认为可以从另外一个角度来看“用户体验“的影响因素。上面这个图是我今天思考的一部分，这是- 确实，如果在原网站如果存在表单提交或cookies的验证，对于ASP来说，不使用基于SOCKET的组件就难以完成，其实，XMLHTTP的另外
- 1．漏洞介绍在XHTML 1.0标准下，使用特殊构造的CSS样式，在Internet Explorer 7.0
- 译者的话：寡妇、孤儿、捧打鸳鸯，这些场面足以让你有想哭的冲动，但当你在排版设计时，同样会碰到这些问题，甚至可能更槽。虽说今天的页面排版软件可
- 现在很多以内容为核心的网站上都在文章底部添加了社会化分享按钮，能让浏览用户在发现一篇有价值的文章时，可以通过社会化网络快速分享给自己的好友，
- 代码如下:--创建测试表 DECLARE @Users TABLE ( ID INT IDENTITY(1,1), UserIn
- 1. 用Dreamweaver 4.0制作闪动的Flash按钮选择菜单Insert→Interactive Images→Flash But
- Microsoft SQL Server 2005 Mobile Edition 3.0 (SQL Server Mobile) 支持两种与
- SQLSTATESQL SERVER 驱动程序错误描述 HY000所有绑定列都是只读的。必须是可升级的列，以使用 SQLSetPos 或 S
- 很多人喜欢把一个网站中相同的部分象是统一的页面logo，版权声明等做成一个过程，然后放到一个include文件中，这样所有的页面就都可以使用
- 漂亮的代码是漂亮网站的基础，优秀的 CSS 只存在与同样优秀的 HTML 之上，干净的，语义的 HTML 代码让一个网站更健壮。本文讲述了1
- 在用户登录windows操作系统的时候，如果触发到了登录表单的密码录入框上，并且此时按下了“大写锁定键(Caps Lock)”，那么界面上会
- 由于网络带宽以及某些WAP服务器DECK传输的限制，所以DECK越小越好，最好不要超过1.2K。如果你的需求很复杂，最好分成几个DECK来完
- 很多人一直都有个想法，要是可以随心所欲的操作iframe就好了。这样静态页面也就有了相当于后台动态页面php,jsp,asp中include
- oracle数据库的快照是一个表，它包含有对一个本地或远程数据库上一个或多个表或视图的查询的结果。正因为快照是一个主表的查询子集，使用快照可
