twitter-bootstrap - Bootstrap网格系统半屏

Question

是否可以制作两行，每行 4 行，屏幕高度为 50%？

Bootstrap 代码:

<div class="row">
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
  <div class="col-md-3">.col-md-3</div>
</div>

Answer 1

如果您使用 Bootstrap 4，这很容易完成..

.row {min-height: 100vh;}

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

对于 Bootstrap 3(非 Flexbox)使用此..

.row {height: 100vh;}
.row>.col-md-3 {height: 50%;}