Question

所以我想在这个模型中创建一个五列布局：

five column layout mockup

所以这是我的问题：

我知道我可以将整个网格更改为可被5整除的数字，并创建新的列类。

但是......这不是一个选项，因为我们已经构建的很多东西都基于12列网格。

... SO

如何创建5列布局，网格系统固定为12？

这是在Drupal 7中的面板模块中完成的，我们使用bootstrap类来提供布局。但是我想知道我是否有一个覆盖引导程序样式的样式表，只是创建自己的样式表，但如果可以的话，我更愿意使用引导程序。

感谢您的帮助，意见和建议。

干杯。

Answer 1

您将使用Bootstrap列偏移。你实际上使用12列单位中的10个，然后像这样偏移第一个最左边的列：

<div class="container-fluid">
    <div class="row">
          <div class="col-sm-2 col-sm-offset-1">
            ..
          </div>
          <div class="col-sm-2">
            ..
          </div>
          <div class="col-sm-2">
            ..
          </div>
          <div class="col-sm-2">
            ..
          </div>
          <div class="col-sm-2">
            ..
          </div>
     </div>  
</div>

http://www.bootply.com/GtXXrcUa5Q

this answer

中介绍了获取五列布局的其他选项

Bootstrap 4 - 5 columns

五列引导布局，无需更改网格大小

1 个答案: