小编Alo*_*rse的帖子

使用bootstrap 4对3列进行排序和堆叠

我在bootstrap列中有这个结构:

我希望您更改为更低的分辨率,请按以下顺序排序:

但我不能将我的项目的整个结构更改为flexbox,所以我想知道如果使用bootstrap 4,则可以这样做.

非常感谢你.

我考试不好.

@import url( 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css' );

div {
  text-align: center;
  height: 60px;
}

#left {
  background: yellow;
}

#middle {
  background: blue;
}

#right {
  background: coral;
}

Run Code Online (Sandbox Code Playgroud)

<div class="container">
  <div class="row">
    <div class="col-sm-3 col-md-3">
      <div id="left">COLUMN 1</div>
    </div>
    <div class="col-sm-6 col-md-6">
      <div id="middle">COLUMN 2</div>
    </div>
    <div class="col-sm-3 col-md-3">
      <div id="right">COLUMN 3</div>
    </div>
  </div>
</div>

Run Code Online (Sandbox Code Playgroud)

css flexbox twitter-bootstrap twitter-bootstrap-4 bootstrap-4

Alo*_*rse

2017 05-23

5
推荐指数

1
解决办法

728
查看次数