翻译自http://snook.ca/archives/html_and_css/matrix-layouts/ 转载请注明出处
这篇文章不是你所想的。这也不是一些您可以执行的便捷小巧的CSS技术。反正。这是一个想法，我一直在努力。一个想法-我所希望实现的-有一天你和我能够建立更好的网站。
我来说说我自己的
设计想法。
嗯，为什么？谁能整好知道他们要做些什么吗？显然，我会的。这是好事。有些人抱怨并事实没有提供解决方案。利用CSS的布局也有其不足之处。我深入过基本的table布局。float和基本定位的布局。我清楚存在的局限性。但我很少抱怨它。
我喜欢其他更好的吗？是的。我不会抱怨。这是我提出的一个解决办法。
埃里克罗迈耶想要一种布局系统，我将尽力给他想一个（和我们其他人也可以享受它） 。
我们已经有布局的方式难道不接近W3C吗？是。我们
模板（即高级）的格状布局和
定位模块。我认为，前者是过于复杂，而后者必须定义（也是不太方便） 。
很难提出一种布局，使它的规范接近现有的系统，这是近一个月以来罗迈耶的missive （疯狂的想法提出） 。每当我有时间（比如驾驶，睡觉前，在卫生间），我想尝试，并弄通它怎样实现。这是令人惊讶的。偶尔我会想到一个主意。我想怎样实现继承，怎样与其他系统定位，并设想将原有思想打破。
然后，
灵感突现。那天晚上我花了一个小时把我的想法写下来。我讲给这几个人。没有人理解。我画了草稿一些人明白了，但他们仍然不是很清楚。我调整了一些，并增加更多的使用情况。我一个个地讲给他们 （但，他们并不完全理解我的想法。 ）我愿意分享给大家。
那么，什么是矩阵布局呢？矩阵布局就像基本table布局结合绝对定位。它只会增加一个属性，并尝试实现现有的概念（margin，padding，border和其他的属性） 。他将为你所有的模板提供完美的解决方案吗？不，我已经看到的有些地方是不合适的。但它会比我们现在用的要好。
以下就是基本的创意 ：你用定位属性把每个格子放到应该在的位置。让我们来看看下面的例子。
例如布局3列和第二栏中有三小格。
这是一个3栏的设计，但中列有一行标题。我用字母来标记他们的顺序。现在，让我们用矩阵布局的观念来看看，写出如下代码：
#a { position: matrix(1,2, 1,4); }#b { position: matrix(2,2); }#c { position: matrix(2,3); }#d { position: matrix(2,4); }#e { position: matrix(1,1, 2,1); }#f { position: matrix(1,5, 2,5); }这个大块被每行每列的最高数目分成一个个小格子。矩阵值是二维的。第一维是它的左上角，第二维是它的右下角，第二维没有了就用第一维。（换句话说，只表示一块区域。）
如果你已经看到了这个先进的布局草案，你可能会看到一些小的相似之处。这不是强大的高级布局，但希望这简单的改进能够尽早实现。这种看起来像表的基础的布局，但它有独立的序列（这个例子中没有其他属性） 。
工作进展这的确是一项进展中的工作。将继续发展;我再完善这个想法。我脑子里很清晰，却表达不清。
确实有很多需要改进。我能马上想到一些。负数margin怎么解决呢？我不知道。如果box的数量不增加高和宽又怎样变化呢？我更怀疑，但我不知这些方案当前浏览器支持不支持。
目标最后，我想浏览器开发者能整合矩阵布局到下一个版本的浏览器。我提出这个想法，希望能够推广，让反得到馈，并逐渐壮大。
让一起加油吧。
2、到Drupal官方网站下载最新版本的Drupal，解压到网站目录下（/var/www）,文件名为drupal;
示例如下图：
