css - 如何使用 Bootstrap 和 LESS 创建流畅的布局？

Question

如何使用 Bootstrap 和 LESS 创建流畅的布局，而无需编写如下代码：

<div class="span12">

我尝试创建 LESS 代码并编写以下代码：

@import "bootstrap";

div#wrap {
  .container-fluid;
}
header {
  #grid > .fluid > .row-fluid;
}
div#logo {
  #grid > .fluid > .span(2);
}
nav {
  #grid > .fluid > .span(10);
}

但这不起作用。怎么了？

Answer 1

Have you tried using makeRow() and makeColumn ? You can use them like that :

header {
  makeRow();
}
div#logo {
  makeColumn(2);
}
nav {
  makeColumn(10);
}

Here is a great article explaining why and how to use Bootstrap mixins in LESS : link