0

我尝试了 CSS-Framework Bootstrap，我有一个问题。

这是小提琴：http: //jsfiddle.net/hzAUz/

假设我有一个 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>

那么，当你使用 Bootstrap 时，会发生什么情况，一旦窗口变小，Div 就会按以下优先级堆叠：1. 左 2. 内容 3. 右

但这是有道理的，把内容放在第一位。

有谁知道在使用 bootstrap-responsive.css 时如何插入优先级？

非常感谢您提前。

公斤，乔治

4

3 回答 3

0

我不相信 Bootstrap 2 中有办法，但如果你要迁移到 Bootstrap 3，你可以控制列排序。有关详细信息，请参阅http://getbootstrap.com/css/#grid-column-ordering。

于 2013-09-23T16:48:23.677 回答
0

有几种方法可以做到这一点。一种是：从移动设备尺寸开始，设计“移动优先”。这将使您的小屏幕变得容易，然后您可以向这些容器添加额外的类以适应更大的屏幕尺寸。

另一种选择：计划移动设备，看看您是否不能隐藏/转换较小屏幕尺寸的元素，使其更适合移动设备。即...您左侧的导航链接堆栈成为移动设备中的选择菜单；因此，只占用了一条线的房地产。

我的偏好是使用 javascript，并将左侧和顶部导航转换为移动尺寸的显示/隐藏元素（按钮）。这样，我的 UI 顶部只有一个徽标和按钮，内容紧随其后。

于 2013-09-23T16:45:30.250 回答
0

正如@Sean 建议的那样，如果可以的话，一定要升级到 bootstrap 3，但如果你现在不能，其中一些答案可能会有所帮助：

在 Twitter Bootstrap 2 中，如何在缩小屏幕时让正确的列移动到顶部？

于 2013-09-23T16:56:45.363 回答