Bootstrap跨度

我最近開始使用Twitter Bootstrap，我似乎無法理解跨度是什麼，爲什麼會出現不同的編號跨度，如span4，span12？什麼是抵消和什麼時候使用？（有時與跨度一起使用）我試圖在網上搜索它，但只發現有關bootstraps的具體問題。Bootstrap跨度

來源

2012-07-30 Grigor

引導程序「span」類用於bootstrap grid system。

該文檔顯示標有數字的列，每個數字表示用於此容器的span類。下一部分顯示了偏移量，它們定義了跨度左側應該有多少個空列。

您可以將span4 offset2讀爲「將此塊擴展到4列，左邊留出兩列」。
默認情況下有12列。如果你有一個span12，它將和container一樣寬（可能是流體）。

來源

2012-07-30 09:19:08 Kapep

另外，創建主體時，我只是把它放在類容器中嗎？因爲有很多不同的方式，所以在創建導航欄後，我想知道創建主體並在其中添加內容的正確方法。有沒有辦法讓文字居中讓我們說

標籤？ – Grigor 2012-07-30 09:24:36

要使用網格系統，您應該選擇[佈局]（http://twitter.github.com/bootstrap/scaffolding.html#layouts），添加至少一行（請參閱DavePs示例），併爲任何元素創建一個跨度你想要在網格中定位。儘管你不需要使用網格系統，但也可以手動設置一些寬度，特別是如果你不需要很多列。我認爲像中心文本這樣的其他樣式應該在加載bootstrap後在另一個css文件中完成。就像把'h1'放入帶有'span12'的'div'中，給它一個id或者額外的class和樣式，通常的CSS使用'text-align：center;' – Kapep 2012-07-30 09:32:58

kapep對於其他樣式是正確的 - 我認爲下載包含了一個application.css文件，但如果沒有，請將樣式放入其中，以便升級到Bootstrap以保持您的更改不變。 – DaveP 2012-07-30 09:36:16

首先，它們不是<span>標籤。（我提到這是因爲我已經開始輸入<span>幾次了！）它們是連續的列寬。

從http://twitter.github.com/bootstrap/scaffolding.html#gridSystem：

<div class="row"> 
<div class="span4">...</div> 
<div class="span8">...</div> 
</div>

該文檔還討論了偏移。

來源

2012-07-30 09:18:33 DaveP

22As據我所知，如果你想要的風格響應的頁面佈局，你也可以使用COL-LG-2或一些類那樣，寫一個div標記，當像

<div class="col-lg-2 col-sm-3 col-xs-6"> some content </div>

這將定義一些內容在屏幕上佔用多少列，用於大型，小型和特小型屏幕。問題是，你每行最多有12列，所以你所有的內容都必須尊重這一點。你不能有

<row> 
<div class="col-lg-5">content1 </div> 
<div class="col-lg-6">content2 </div> 
<div class="col-lg-3">content3 </div> 
</row>

，因爲這裏有14個大列。只有xs類增加到24，儘管

那麼，span做同樣的把戲嗎？

來源

2015-02-04 15:47:31 marko

這是bootstrap 3. span1到span12 ----這是bootstrap 2。 – 2015-06-04 17:11:07

回答

相關問題