Jquery 具有两行和列的引导列

下面是我正在处理的代码，如何将代码转换为具有行和列的引导网格布局。我希望卷和存储都在一个单独的行中，在彼此的下面

下面是它应该是什么样子的图片

<div class="container-fluid">
  <div class="row">
     <div class="col-md-3 col-lg-3>
         <div class="row">
         </div>
         <div class="row">
         </div>
     </div>
  </div>
</div>

嗯。我相信你想要一个由8列组成的行。如果我没弄错的话，你可以这样做

您可以使用
.col-xs-X
类创建包装器，具体取决于您希望内部列的宽度

然后创建宽度为100%的自定义列，其偏差为X，其中X是列数

HTML

<div class="container">

    <div class="row">

        <div class="col-xs-3 col-xs-offset-4">

          <div class="row">

            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>
            <div class="col-xs-1 col-xs-1-custom"></div>

          </div>

        </div>

    </div>

</div>


在您的例子中，它的100/8=12.5%。但是如果您想在这些列之间留有空间，您必须减小宽度，以免它们溢出。在我的例子中，我大约拿走了2%，以使利润不溢出

您还可以计算每个媒体查询断点的确切边距和宽度。在我的例子中，
margin
在1170px断点处从293px（
.col-xs-3
）中取出40px，因此对于您的列，100%宽度不是293px，而是293px-40px

还有另一种方法可以使用LESS/SASS自定义
@grid columns
变量，查看它在重新编译的版本中的外观，然后简单地从那里拖动所有设置

这里是如果您没有少用/sass，它将为您完成所有工作。
非常感谢。。。我在这里实现它时遇到了一个问题。。。我想要两行，一行用于存储，另一行用于卷。。。它不起作用，而且当我重新调整COL的大小时，COL会缩小。@theJava这里是我为volume创建的列。在
col-xs-4
中，我创建了一个新行和一个
.col-xs-12
。但是稍微更改了宽度，以便与存储匹配。当然，随着视口的减少，将对列进行堆叠。但你要求在引导中这样做。您可能不想在这种定制设计中使用引导，因为从头开始创建smth比覆盖引导的默认设置更容易。
.col-xs-1-custom{
    width: 10.5%; /* 100/8 = 12.5% and 2% taken to let margins appear */
    background: green;
    height: 25px;
    margin-left: 5px;
}