2015-10-05 45 views
0

我想了解如何重置boostraps列。Bootstrap div重置

如果我這樣做:

Col-md-6 
Col-md-4 

我怎麼會再創建一個新的行其中列從1開始回來,而不是11 我不明白的地方(如果)我應該使用clearfix

非常感謝 大衛

回答

2

如果第三COL-MD是大於2,引導使得自動一個新行,因爲(4 + 6 +(X> 2))> 12比你別t需要 a clearfix

如果第三列是COL-MD-1或COL-MD-2,則可以使用clearfix清除電流流動和列設置到一個新的行:

<div class="row"> 
    <div class="col-md-4"> 
     col-md-4 
    </div> 
    <div class="col-md-6"> 
     col-md-6 
    </div> 
    <div class="clearfix"></div> 
    <!-- New row --> 
    <div class="col-md-2"> 
     col-md-2 
    </div> 
</div> 

新線自動(4 + 6 + 6 = 16)> 12:

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

Clearfix還可以用於僅在特定設備寬度來顯示列,例如:

<div class="clearfix visible-xs-block"> 
    only visible in xs and a block element 
</div>