如何減少引導網格系統的代碼？

Question

我正在用bootstrap編寫一些代碼，我經常使用"container-fluid col-lg-3 col-md-3 col-s-3 col-xs-3"或"container-fluid col-lg-6 col-md-6 col-s-6 col-xs-6"。我想知道是否有辦法減少我編寫的代碼，而不是多次寫入這些行。

感謝

Answer 1

col-lg-3 col-md-3 col-s-3 col-xs-3是僅使用col-xs-3

，最好的辦法去想電網類實際上相同的是，他們從移動了工作。這意味着默認情況下，您的網格將從移動堆疊到您使用的網格類斷點。

例如，使用.col-lg-4意味着您的網格將保持堆疊在移動設備，平板電腦和小型桌面屏幕上。只有到達大桌面斷點時，網格纔會水平。

旁註：

col-s-3應該是col-sm-3。

container-fluid是一個容器類，不應該與列類

一般結構應該是這樣的：

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-xx-x"> 
      Column 
     </div> 
     <div class="col-xx-x"> 
      Column 
     </div> 
    </div> 
    <div class="row"> 
     ... 
    </div> 
</div> 

Answer 2

沒有必要這麼多類，如果寬度是要去三個colunms在所有屏幕尺寸上。從最小的屏幕col-xs-3開始就足夠了，寬度在所有斷點上都是相同的。另一件事不要使用容器類的列類。 Bootstrap結構首先是容器，然後是行，然後是列。