twitter-bootstrap – 哪个在bootstrap中使用push或offset更好？

发布时间：2020-12-17 21:30:32 所属栏目：安全来源：网络整理

导读：当我想要两列之间的空间时,哪个更好地使用偏移或推送？ HTML div class="row" div class="col-md-2 col-md-offset-1"123 3456/div div class="col-md-2 col-md-offset-2"123 1234/div/divdiv class="row " div class="col-md-2 col-md-push-1"123 3456/div d

当我想要两列之间的空间时,哪个更好地使用偏移或推送？

HTML

<div class="row">
    <div class="col-md-2 col-md-offset-1">123 3456</div>
    <div class="col-md-2 col-md-offset-2">123 1234</div>
</div>

<div class="row ">
    <div class="col-md-2 col-md-push-1">123 3456</div>
    <div class="col-md-2 col-md-push-3">123 1234</div>
</div>

解决方法

我会说偏移对于像你这样的基本操作更好.您应该仅使用推/拉来强制使用偏移量无法实现的特定位置的块.

推/拉用户离开时偏移使用边距 – 如果你可以使用margin-left,你应该避免.

因此,举个例子,使用这样更好：

<div style="margin-left: 8.33333%;"></div>  // col-xs-offset-1

而不是像这样使用：

<div style="position: relative; left: 8.33333%;"></div>  // col-xs-pull-1

但是一个完整的例子是这样的：

<div class="row">
    <div class="col-sm-6 col-sm-push-6">
        Content B
    </div>
    <div class="col-sm-6 col-sm-pull-6">
        Content A
    </div>   
</div>

在一个额外的小设备(xs)上它将看起来是like：

Content B
Content A

在一个小设备(sm)上它看起来像：

Content A      Content B

因此,如果您想要更改块的顺序,则无法使用偏移量来执行此操作,只能通过拉/推来执行此操作.因此,对于这种特殊情况,您应该使用pull / push(当您想要更改块的顺序时),并且您应该使用offset来进行简单操作,就像在您的示例中一样.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!