css - 基于父列的自举列数

有谁知道这是否可以通过引导混合来完成。

列（父级数）

像Neat一样。

在整洁的列中，mixin的工作方式如下

@mixin span-columns($span, $display: block) { ... }

$ span可以是3或类似12之3


  指定元素应跨越的列数。如果
  选择器是嵌套的，其父元素的列数应为
  也可以作为参数传递。


谢谢

最佳答案

当我很好地理解您的问题时，您应该阅读Less mixins and variables。

您将在Bootstrap源代码的less/mixins/grid.less文件中找到用于生成语义网格列的mixins。

要生成一个跨越3列的div，您应该使用例如：

div.three{
.make-xs-column(3);
}

注意这些混入的移动优先。使用以上代码，xs混合生成CSS代码，该代码将应用于所有屏幕宽度（无媒体查询）。

使用时：

div.three{
.make-xs-column(6);
.make-sm-column(3);
}

您的div将跨越6列，以使屏幕宽度小于768像素（xs网格），而超过3列则高于768像素（sm网格）向上（除非您要跨越，否则无需显式调用较大的网格混合）列数不同）。在较大的网格之前启动较小网格的混合是很重要的，另请参见：Bootstrap 3 mixin multiple make-*-column

关于css - 基于父列的自举列数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26899410/