使用Materialize在手机上重新排序列

Question

我正在使用物化框架,并试图在电话视图中重新排序列顺序.我希望购买按钮在手机上的内容之前.尝试拉和推,但无法搞清楚.有帮助吗？

先感谢您.

<div class="row">
    <div class="col s12 m3 l3">
      <img src="">
    </div>
    <div class="row">
      <div class="col s12 m6 push-m6 l7">CONTENT</div>
      <div class="col s12 m6 pull-m6 l2">BUY BUTTON</div>
    </div>
</div>

Answer 1

我认为你应该将你的布局整理为移动优先:BUY BUTTON默认情况下会出现,在平板电脑屏幕或更大的(.m或.l类)中,你使用push和pull:

<div class="row">
    <div class="col s12 m3 l3">
        <img src="">
    </div>
    <div class="row">
        <div class="col s12 push-m6 m6 push-l7 l2">BUY BUTTON</div>
        <div class="col s12 pull-m6 m6 pull-l2 l7">CONTENT</div>
    </div>
</div>