代码之家 › 专栏 › 技术社区 › Thomas Segato

引导4和设备类型之后的顺序

bootstrap-4

1

Thomas Segato · 技术社区 · 7 年前

<div class="row">
  <div style="border:1px solid red" class="col-sm-8 order-sm-12">result</div>
  <div style="border:1px solid red" class="col-sm-4 order-sm-1">search</div>
</div>

左和除了手机,其他所有设备都可以使用。当使用手机时,我希望在屏幕顶部进行搜索。我可以看到在引导程序4中,左/右拉已被订单所取代。但是在上面的样本中结果

秩序应该如何理解?我预计order-sm-1将出现在一个小屏幕上,它将是第一个(添加到顶部),order-sm-1将意味着添加到最后?在其他尺寸上,该类会被忽略吗?

1 回复 | 直到 7 年前

1

Carol Skelly 7 年前

当你使用 order-sm-* 它的意思是“小而高”。因此,您希望使用。。。

<div class="container">
    <div class="row">
        <div style="border:1px solid red" class="col-sm-8 order-1 order-sm-0">result</div>
        <div style="border:1px solid red" class="col-sm-4 order-0">search</div>
    </div>
</div>

https://www.codeply.com/go/fZoKZ56sXr