如何更改引導3格列順序

做我的第一個響應式設計，是這樣的可能在引導3. LG更改此：如何更改引導3格列順序

[a] [  ] 
[b] [ c ] 
    [  ]

這對SM：

[a] 
[c] 
[b]

來源

2015-01-15 novox

您可以使用隱藏-SM級 - 在這裏檢查的參考http://getbootstrap.com/css/ ＃responsive-utilities –

你想要[c]在sm上堆疊下來。那麼sm中的順序不應該是[a] [b] [c]？由於c與b處於同一水平，所以如果它在小屏幕上疊加，它會低於b。 – RahulB

c與b不在同一水平，它與A和B的分辨率處於同一水平 – novox

您可以使用兩個div。一種用於第一種安排，另一種用於第二種安排。第一個僅以lg顯示，而最後一個僅以sm顯示。

<div class="hidden-sm"> 

</div> 

<div class="hidden-lg"> 

</div>

來源

2015-01-15 11:12:18

我對此非常感興趣。隱藏元素是否也是正確的方式呢？他們可以用其他方法嗎？ – novox

的響應能力，你可以像你的需要添加類像col-lg-8一樣。 –

隱藏div沒有問題。這是我知道的解決方案。 –

在您的HTML標記中，將[c]放在[a]和[b]之間。向a和b添加課程'左拉'。向課堂添加課堂「向右拉」。最後，將它們包含在定義斷點的div中，如class ='col-sm-12 col-md-12'。

來源

2015-01-15 11:35:03

你是天才，小腿很多，問題解決了。 – novox

我還有一個問題給你，如果我想在sm上得到[b] [c] [a]，可以用html bootstarp方法做到這一點嗎？ – novox

將問題標記爲可能會出現的其他人的回答。關於第二個問題，我沒有得到很好的結果..... col-sm-12課程處理這個問題。除非你想要更小的div？使用較小的數字代替12。 –

您可以使用C列pull-right ..

<div class="row"> 
    <div class="a col-lg-6"> 

    </div> 
    <div class="c col-lg-6 pull-right"> 

    </div> 
    <div class="b col-lg-6"> 

    </div> 
</div>

演示：http://bootply.com/9UNb9Q37G0

來源

2015-01-15 12:32:33 ZimSystem

如何更改引導3格列順序

回答

相關問題