帶Twitter引導程序的1/3列

我使用Twitter Bootstrap 2.0創建了一個自定義網格，並且試圖找出如何更新網格以允許使用1/3和1/2列。帶Twitter引導程序的1/3列

它看起來像1.0你可以只使用：

<div class="span-one-third"></div>

有沒有人能想出一個辦法做2.0類似的東西，還是我忽視的東西？

由於

來源

2012-04-19 C Dog

對於較新的版本（因爲V2），只需使用span4或COL-XX-4列，因爲它是一個12列的網格。

對於引導2：

<div class="span4"></div>

對於引導3（例如）：

<div class="col-sm-4"></div>

ORIGINAL和過時的答案

只是爲了清楚，這個答案是維持與使用Bootstrap v1的HTML應用程序的兼容性，該應用程序沒有任何響應的內容，並且網格爲16列ns（當他們改變這種情況時，已經使用v1的一些項目開始使用新版本的v2版本，開銷16列）。而且他們實際上擁有.span-three-class等css類。

只需從bootstrap v1 css（帶有網格16）實現舊值，因爲v2不再實現它。

.span-one-third{width:300px;} 
.span-two-thirds{width:620px;} 
.offset-one-third{margin-left:340px;} 
.offset-two-thirds{margin-left:660px;}

現在你仍然可以有跨度三分之一和跨度三分之二的類。這是從Bootstrap代碼中提取的：https://github.com/twbs/bootstrap/blob/v1.3.0/lib/scaffolding.less#L133

來源

2012-05-02 16:15:56

對於任何訪問此的人來說，瞭解不使用此代碼非常重要。它會打破響應式的風格，今天它不正確，也沒有正確的建議。 – jonschlinkert 2012-10-23 02:43:42

而不是僅僅說這是錯誤的，爲什麼不提供一個替代解決方案的問題？你可以編輯答案。 – doogle 2012-11-01 14:22:30

是的，它不適用於響應式樣式，但也可以使用響應式樣式來處理，只需將％值與流體行類一起添加即可。該代碼只是爲了幫助他在將引導從1.0更新爲2.0時保持其應用程序不中斷運行。我不認爲這是錯的，但它確實錯過了敏感的價值觀。這是舊的價值觀，正如他所說：「我創建了一個定製的網格」。它適用於從1.0更新到2.0以及在其應用上使用16個網格系統的用戶，因爲它不再實施。 – 2012-11-01 20:47:50

引導用於包括翼展三分之一的原因是，在網格中使用16列。今天，Bootstrap的網格默認包含12列（跨度）。所以，假設你沒有自定義使用不同的列數只是使用以下電網：

<!-- 3-columns, 1/3 each --> 
<div class="row"> 
    <div class="span4">1/3 width</div> 
    <div class="span4">1/3 width</div> 
    <div class="span4">1/3 width</div> 
</div> 

<!-- 2-columns, 1/2 each --> 
<div class="row"> 
    <div class="span6">1/2 width</div> 
    <div class="span6">1/2 width</div> 
</div>

來源

2012-04-19 23:06:15 jonschlinkert

帶Twitter引導程序的1/3列

回答

相關問題