Html 我们是否可以更改Div在移动或平板电脑视图中的位置（引导）

我想更改一个div的顺序。我有的是。。（HTML）

现在我想要搜索栏div在移动视图中nvgtn菜单div的正上方？ 有没有这样做的选择？还是什么把戏

像这样：）

以下是我的建议：

灵活订单与css3：

<div class="core">
<div class="header"></div>
<div class="navgtn-menu"></div>
<div class="search-bar"></div>
</div>

唯一的问题是，这在IE9或更低版本中不起作用，所以

如果没有，请执行js append更改顺序或在其下方复制

$( $('.search-bar').html() ).appendTo('.mobile-move');

这看起来像：

    <div class="core">
    <div class="header"></div>
   <div class="mobile-move"></div>
    <div class="navgtn-menu"></div>
    <div class="search-bar"></div>
    </div>  

---

这样，它只会复制，但通过css媒体查询，您可以隐藏/显示它。

哪个引导版本？Bootstrap3确实为此提供了一些功能（假设你想在更大的屏幕上使用列布局），我很确定他的意思是不改变div顺序

.core {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
 }

.navgtn-menu {
-webkit-box-ordinal-group: 3;  
-moz-box-ordinal-group: 3;     
-ms-flex-order: 3;     
-webkit-order: 3;  
order: 3;
}

.search-bar {
-webkit-box-ordinal-group: 2;  
-moz-box-ordinal-group: 2;     
-ms-flex-order: 2;     
-webkit-order: 2;  
order: 2;
}

$( $('.search-bar').html() ).appendTo('.mobile-move');

    <div class="core">
    <div class="header"></div>
   <div class="mobile-move"></div>
    <div class="navgtn-menu"></div>
    <div class="search-bar"></div>
    </div>