Responsive Bootsrap設計：堆疊Divs的優先權？

我試着CSS-Framework Bootstrap，我有一個問題。Responsive Bootsrap設計：堆疊Divs的優先權？

比方說，我有一個div，有它內部的3周相等的div：

<div id="main" class="row"> 
<div id="columnleft" class="span4">LEFT</div> 
<div id="MainContent" class="span4">Content</div> 
<div id="columnrigh" class="span4">Right</div> 
</div>

所以會發生什麼，當你使用引導，就是儘快窗戶變小，的div堆疊在這一優先： 1.左 2.內容 3.右鍵

但它是有道理的，先放內容。

有誰知道在使用bootstrap-responsive.css時如何插入優先級？

非常感謝您提前。

KG，喬治

來源

2013-09-23 LoveAndHappiness

有你可以做到這一點的幾種方法。一個是：從手機尺寸開始，設計「手機第一」。這將使您的小屏幕工作變得簡單，然後您可以爲這些容器添加額外的類以適應更大的屏幕尺寸。

另一種選擇：規劃移動設備，並查看您是否無法在較小的屏幕尺寸上隱藏/轉換您的元素，以使其更適合移動設備。即......您左側的導航鏈接堆棧成爲手機中的一個選擇菜單;因此，只佔用一行房地產。

我的首選是使用JavaScript，並將左側和頂部導航轉換爲手機尺寸的顯示/隱藏元素（按鈕）。這樣，我的用戶界面頂部只有一個徽標和按鈕，並且緊隨其後的是內容。

來源

2013-09-23 16:45:30 Dawson

哈哈...是...你給了我一個好主意。我可以使用「visible：desktop」類，每次窗口變小，左列消失，內容首先顯示......我不確定你的意思是...... – LoveAndHappiness

我的意思是說。但不顯示：無......無論屏幕大小如何，每一個內容/功能都可用。我的意思是：在手機上，我不會像我做主要內容那樣顯示左側內容;不過，我傾向於從手機設計起來。作爲事後考慮不能移動。如果它是左側導航...它可以顯示爲下拉菜單（或按鈕/ js界面），而不是UL。如果它是左邊的內容，我會將它們堆疊在Main，Left，Right ...上，並使用平板電腦/桌面上的CSS使它成爲L/M/R – Dawson

我不相信在Bootstrap 2中有一種方法，但是如果您要移動到Bootstrap 3，則可以控制列排序。有關詳細信息，請參閱http://getbootstrap.com/css/#grid-column-ordering。

來源

2013-09-23 16:48:23

好像你是對的。谷歌搜索列排序，發現這篇文章，這解釋了你說的更詳細：[鏈接]（http://mattduchek.com/differences-between-bootstrap-v2-3-and-v3-0/）謝謝很多。你有什麼想法，當引導3將出來？（我知道RC已經可用，我的意思是穩定版本） – LoveAndHappiness

最後（3.0.0）上個月出現了一段時間。他們已經朝着3.0努力。1，所以如果你想上移，你應該安全地使用它。 –

明確升級來引導3，如果你能像@Sean建議，但如果你不能現在，一些答案可能會有所幫助：

In Twitter Bootstrap 2, how can I get right columns to move to the top when shrinking the screen?

來源

2013-09-23 16:56:45

Responsive Bootsrap設計：堆疊Divs的優先權？

回答

相關問題