如何使用引导程序制作这个特定的 3x5 布局？答案

【问题标题】：How to make this specific 3x5 layout with bootstrap?如何使用引导程序制作这个特定的 3x5 布局？
【发布时间】：2015-10-12 00:54:18
【问题描述】：

我已经尝试制作这个布局很长时间了，但我没有得到结果。

这是一个 3x5 的网格，至少我能看到什么，不确定它是否是 5x5 和 2 个列只是不可见但仍然存在。

我知道 bootstrap 有一个网格系统，但我无法利用它并获得想要的结果。

我知道了：

<div class="row clearfix">
    <div class="col-md-12 col-sm-12" style="margin-left:2%">    
        <div class="single-profile-top wow fadeInDown" data-wow-duration="1000ms" data-wow-delay="300ms">
          <div class="row">
               <div class="col-md-20">
               COMPRESSORES SEMI-HERMÉTICOS
               </div>
               <div class="col-md-20">
               TUBOS E ACESSÓRIOS DE COBRE
               </div>
               <div class="col-md-20">
               DEPÓSITO DE LÍQUIDO  
               </div>
               <div class="col-md-20">
               ...
               </div>
               <div class="col-md-20">
               ...
               </div>
           </div>
           <div class="row">
               <div class="col-md-20">
               COMPRESSORES SEMI-HERMÉTICOS
               </div>
               <div class="col-md-20">
               TUBOS E ACESSÓRIOS DE COBRE
               </div>
               <div class="col-md-20">
               DEPÓSITO DE LÍQUIDO  
               </div>
               <div class="col-md-20">
               ...
               </div>
               <div class="col-md-20">
               ...
               </div>
           </div>
        </div>
    </div><!--/.col-lg-4 -->                    
</div> <!--/.row -->

【问题讨论】：

我在这里可能弄错了，但是 bootstrap 使用以 12 为基数的网格。我不明白您为什么要使用 .col-md-20，因为您只有 12 列可供使用。
默认为 12。虽然我怀疑他改变了默认值

标签： html twitter-bootstrap twitter-bootstrap-3 grid

【解决方案1】：

试试这样的

<div class="container">
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
</div>

【讨论】：