Bootstrap Grid Offset Quetsion

时间:2015-10-03 14:34:48

标签: html css twitter-bootstrap grid

我是Bootstrap的新手,我遇到过这个问题。

<div class="container row">
    <div id="page" class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
        <div id="header"></div>

        <div id="article"></div>

        <div id="footer"></div>

    </div>
    <div class="col-lg-2 col-md-1"></div>

在boostrap文档中,它显示我不必使用最后一个div。 doc:<div class="row"> <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> </div>

6 + 3 = 9.缺少3个col。我想在进一步了解更多细节之前确保我理解这一点。 如果colrow遗漏row会自动添加public class DnaTest { public static void main(String[] args){ aGoodBase('A'); } public static boolean aGoodBase (char c) { char [] charArray = { 'A', 'G', 'C', 'T' }; boolean aBase; if (c == 'A' || c == 'G' || c == 'C' || c == 'T') { System.out.println(aBase); return true; } else { System.out.println(aBase); return false; } } } 吗? 或者从长远来看,我会遇到一些惊喜错误。

之前我正在使用1200px网格系统。而且我总是要按正确的顺序添加cols并正确的数字。

2 个答案:

答案 0 :(得分:2)

6 + 3 = 9&amp;其余的列/网格,即3列空间将保持为空,它不会给出任何错误,它只是通过移动它从左边3列和右边的3列中心对齐具有类col-md-offset-3的DIV所以DIV将在中心对齐。

希望这会带来一些清晰度,谢谢。

答案 1 :(得分:0)

首先:不要将类容器和行放在同一个div中。

答案:如果你开始一个新行,它将从零开始计数。

您可以将所有部分放在不同的容器中。

<div class='container'><!--this is your container-->
  <div class='row'><!--this is your row-->
     <div class='col-md-4 col-md-offset-3'><!--populating row with col with offset-->
     </div>
  </div>
  <div class='row'>
     <!--some other cols will start counting from zero because it is a new row-->
  </div>
</div>