在较小的屏幕中将Bootstrap垂直定位到水平

Question

我使用bootstrap进行响应式设计。

这是计算机的视图：

这是ipad上的视图：

当我改用iPad将这些垂直菜单框更改为水平状态时，有可能以某种方式：

我使用这个类：

<div class="row">
    <div class="col-lg-4">MENU</div>
    <div class="col-lg-8">LIST</div>
</div>

感谢您的任何建议！

Answer 1

请看这里：http://getbootstrap.com/css/#responsive-utilities DOC

col-lg适用于大型设备

对于超小型设备：

<div class="row">
    <div class="col-xs-4">MENU</div>
    <div class="col-xs-8">LIST</div>
</div>

对于小型设备：

<div class="row">
    <div class="col-sm-4">MENU</div>
    <div class="col-sm-8">LIST</div>
</div>

更新： 我不知道什么设备是IPAD（extrasmall，小型或中型设备所以在我的例子中它会很小..

<div class="row">
    <div class="col-md-4">MENU
         <div class="col-sm-4 col-md-12">acccount</div>
         <div class="col-sm-4 col-md-12">transact</div>
         <div class="col-sm-4 col-md-12">details</div>
    </div>
    <div class="col-md-8">LIST</div>
</div>

当您看到<div class="col-sm-4 col-md-12">acccount</div>：

时

这个div在小型设备上是4/12，在中型设备中是12/12（col-md-4）......

我希望我们现在处于相同的浪潮中^^