0

我才刚刚开始。为了让 Bootstrap 在标签上的众多类变得不那么丑陋，我尝试用更少的代码编写一些简单的包装器。

我的全部代码如下。

// Import boostrap.
@import "./less/bootstrap.less";

// General classes for content.
focus {
    .span12;
}

content {
    .span8;
}

side {
    .span4;
}

这个 less 文件的目的是提供漂亮的包装器，它们只做一件事，比如 Bootstrap 的.span12类。我会及时将其扩展到各种按钮。

无论哪种方式，我在使用lessc style.less.

它给出的错误是：

NameError: .span12 is undefined in /srv/http/www/style.less on line 6, column 5:
5 focus {
6     .span12;
7 }

我在.makeColumn(i)该类中找到了一些文档，但问题是 Bootstrap 已经有非常好的媒体查询，我想避免自己编写。

无论如何要包装已经有媒体查询的类，还是我需要把它吸起来并为我的包装器编写我自己的？

4

1 回答 1

1

在这种方法中，您将遇到一些主要问题。

首先，Bootstrap 会动态生成.spanX一系列类，因此它们不能作为 mixins 立即访问，正如我在这个答案中指出的那样。

其次，Bootstrap 的一些span代码不是由.spanX系列设置的，而是通过属性选择器完成的[class*="span"]（参见撰写本文时 mixins.less 文件的第 602 行；它们也广泛用于规则的响应文件中@media）。此选择器代码不会被.span12包含的代码拾取，如果您没有放入.span12代码，那么您的代码将不会应用这些属性。所以你需要解决这个问题。

可能还有其他问题不是很明显，但重点是，如果您想将 Bootstrap 用于网格目的（尤其是响应式），最好按照设计使用它。如果您不这样做，那么最好去复制 Bootstrap 代码并根据您的需要对其进行修改，以制作您自己的简化网格代码（如果您的意图是在您的 html 中使用较少的整体类）。

于 2013-06-20T14:34:44.410 回答