更好地理解CSS网格列 - 使用浮点数的列

Question

我正在使用http://semantic.gs和LESS.js.我很难理解这些概念，文档对我来说并不完全清楚。我承认我没有读过LESS.js，但我已经阅读了语义网格系统网站上的文档。

我的理解是只有大量的列和每个编号的列由less.js处理（？）

// This LESS rule...
article {
   .column(9);
}

// Is compiled to...
article {
   display: inline;
   float: left;
   width: 700px;
   margin: 0 10px;
}

除了列位于不同的位置之外，这大致相同吗？

我如何找到用于页脚的列？我不确定我是否应该使用普通的CSS来制作页脚。

干杯。

Answer 1

很可能已经创建了一个定义列的LESS Mixin。可能看起来像这样。

.column(@span: 1) {
        float:left;
        width: 8.33333% * @span;
}

@span是您希望每个部分跨越的网格列数。所以说它是一个12列网格，那么你可能希望页脚跨越网格的整个宽度：

footer {
        .column(12);
}