如何用更少的引导程序定义网格布局？ [复制]

Question

如果我们在没有预处理器的情况下使用引导程序，我们会将类添加到我们的开始标签中，如下所示：

<div id="El" class="col-md-1"></div>

我习惯于将波旁威士忌与 sass 一起使用，在这种情况下，我可以在 sass 中的元素规则内导入 mixins。在这种情况下，我可以这样做：

  #myEl
    @import span-column(6)

在此处查看较少的引导程序文档：http://bootstrapdocs.com/v3.1.1/docs/css/#less 似乎没有可用于引导程序网格系统的 mixin。他们为供应商前缀、过渡、渐变和其他东西提供了便利的 mixin，但对于他们自己的网格系统却没有。

所以我有几个问题：

如何使用 less 来使用 bootstrap 定义我的网格？

而且，如果我真的想这样做，我是否在使用工具本身？我在想，如果没有记录以这种方式使用较少版本的引导程序，那么也许有充分的理由。也许不应该以这种方式使用较少版本的引导程序，而我应该使用另一组工具？

Answer 1

你可以这样做，但你必须少写。在他们的网站上对 less 有一个很好的介绍：www.lesscss.org。

根据您的情况，您需要：

@import 'bootstrap/bootstrap.less';
@import 'bootstrap/theme.less';

#El {
    .col-md-1;
}

然后你用lessc编译这个文件。之后，您的 #El-element 将表现得像 .col-md-1。

有意地，Bootstrap 旨在与他们的 css 类一起使用，并且使用他们的 less-files 不是引导的第一种方式。但是，如果您了解引导程序并且不太了解，那么您应该没有问题。如果您从 bootstrap 开始，我建议您只使用他们的 css。