容器內的一行是否需要span12？ Bootstrap

Question

我第一次使用bootstrap來開發我的項目。從我可以告訴容器>行工作正常，哪些問題是容器>行> span12需要，還是隻是最佳實踐？

謝謝

Answer 1

問題很混亂。

Bootstrap通過使用浮動網格系統工作。查看下面的來源應該清楚發生了什麼。 .container類設置940px的寬度，.span12類也一樣。 .row類是一個帶有clearfix的div，包含一列浮動的.span列。所有.spanXX類都向左浮動並給出20px的左邊距以創建網格。

如果您正在使用的只是一個容器和一行，那麼您只需創建一個寬度爲940像素，容量爲-20px左邊距的容器。您仍然應該使用.span12與框架保持一致並正確設置邊距。這引發了一個問題，如果你不想利用列，你爲什麼首先使用網格佈局？如果你只想要一個940像素的容器，那就創建一個。

從bootstrap.css：

.row { 
    margin-left: -20px; 
    *zoom: 1; 
} 

.row:before, 
.row:after { 
    display: table; 
    line-height: 0; 
    content: ""; 
} 

.row:after { 
    clear: both; 
} 

[class*="span"] { 
    float: left; 
    margin-left: 20px; 
} 

.container, 
.navbar-static-top .container, 
.navbar-fixed-top .container, 
.navbar-fixed-bottom .container { 
    width: 940px; 
} 

.span12 { 
    width: 940px; 
} 

Answer 2

看看文檔，如果我明白你的問題是正確的，問題就出在這個環節Bootstrap documentation。向下滾動至流體嵌套。

也請記住當計數開始於「0」，這樣

<div class="row-fluid"> 
    <div class="span12"> 
    Fluid 12 
    <div class="row-fluid"> 
     <div class="span6"> 
     Fluid 6 
     <div class="row-fluid"> 
      <div class="span6">Fluid 6</div> 
      <div class="span6">Fluid 6</div> 
     </div> 
     </div> 
     <div class="span6">Fluid 6</div> 
    </div> 
    </div> 
</div> 

在此示例代碼的跨度內創建一個新的容器，你可以看到有一個跨度12這是主要的div 。在這個範圍內有2個6的跨度！這使得靈敏度更高，並且在6的範圍內也有6個跨度，這也是有意義的，因爲每次創建一個新的行級流體類時，您都會在'0'處開始跨度計數。

我希望我能正確理解你的問題！

Gr。 Leroy