0

我决定使用foundation 6 的新弹性网格，我注意到我没有像使用块网格那样得到预期的行为。

这是 HTML，在两个实例中使用的代码相同：

<div class="row">
    <div class="small-3 column end text-center red">
        column 1
    </div>
    <div class="small-3 column end text-center green">
        column 2
    </div>
   <div class="small-3 column end text-center green">
        column 3
   </div>
   <div class="small-3 column end text-center green">
       column 4
   </div>

   <div class="small-3 column end text-center green">
       column 5
   </div>
   <div class="small-3 column end text-center green">
       column 6
   </div>
   <div class="small-3 column end text-center green">
       column 7
   </div>
   <div class="small-3 column end text-center green">
       column 8
   </div>

   <div class="small-3 column end text-center green">
       column 9
   </div>
   <div class="small-3 column end text-center green">
       column 10
   </div>
   <div class="small-3 column end text-center green">
       column 11
   </div>
   <div class="small-3 column end text-center green">
       column 12
   </div>
</div>

我尝试使用Flex Grid和Block Grid

我打算在 Flex Grid 中获得 Block Grid 链接的结果，这可能吗？

我浏览了 F6 文档，但在其中找不到合适的解决方案（至少从我发现的内容来看）。

谢谢！

4

1 回答 1

1

您可以在 Foundation 的 Flex Grid 中使用块状网格。您必须意识到弹性网格完全取代了标准的基础网格。此外，Flex Grid 和 Block Grid 是两个完全不同的东西。Flex Grid 接管整个网格系统（行、列...）。块网格只是一种在多行或单行上分布相同数量的列的方法。

这很可能是您正在寻找的内容：

https://foundation.zurb.com/sites/docs/flex-grid.html#block-grids

这就是如何在 Flex Grid 中使用 Block Grid。

您还需要确保启用了 Flex Grid：

https://foundation.zurb.com/sites/docs/flex-grid.html#importing

于 2016-11-17T19:50:02.810 回答