Bootstrap 3 网格折叠顺序 [英] Bootstrap 3 grid collapse order

查看：30
本文介绍了Bootstrap 3 网格折叠顺序的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

是否有一种简单的方法可以对列在 bootstrap 3 网格中的折叠方式进行排序?

这就是我所拥有的:

<div class='col-sm-8'>
这将在大屏幕上位于左侧，但在小屏幕上位于底部.
<div class='col-sm-4'>

解决方案

您将首先制作您的移动(最小)布局，然后推/拉更大尺寸..

<div class="row"><div class="col-sm-4 col-sm-push-8"><div class="box">4

<div class="col-sm-8 col-sm-pull-4"><div class="box">这将在大屏幕上位于左侧，但在小屏幕上位于底部.

演示:http://www.bootply.com/gH5Ua0iy6i

Is there a simple way to order the way the columns collapse within bootstrap 3 grids?

This is what I have:

<div class='row'>
<div class='col-sm-8'>
    <div class='box'>
        This will be on the left on large screens but on the bottom on smaller screens.
    </div>
</div>
<div class='col-sm-4'>
    <div class='box'>

    </div>
</div>

解决方案

You would make your mobile (smallest) layout first, and the push/pull for larger sizes..

<div class="container">
  <div class="row">
    <div class="col-sm-4 col-sm-push-8">
        <div class="box">
            4
        </div>
    </div>
    <div class="col-sm-8 col-sm-pull-4">
        <div class="box">
            This will be on the left on large screens but on the bottom on smaller screens.
        </div>
    </div>
  </div>

Demo: http://www.bootply.com/gH5Ua0iy6i

这篇关于Bootstrap 3 网格折叠顺序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆