Bootstrap 填充剩余列

Question

是否有一个引导类可以填充许多列尚未被占用的情况？例如，我有这个 div 标签，它可能存在，如果不存在，则可能不存在，我希望第二个 div 占用 12 列，但如果存在，则只占用 8 列。像这样

<div class="row">
   <?php if(something){ ?>
      <div class="col-md-4">
        <div> </div>
      </div>
   <?php } ?>
   <div class="col-md-fill">
     <div> </div>
   </div>
</div>

除了使用之外

<div class="col-md-<?php
     if($count > 5){
         echo "8";
      } else {
         echo '12';
      }
       ?>">

Answer 1

有时我会尝试一些非常愚蠢的事情，但这一次我的愚蠢让我惊讶......

我见过如果我们附加到一个没有任何类的div.row a ，这个无类 div 会填充自己的空白空间....div

小提琴： http: //jsfiddle.net/bhgme789/1/

HTML：

<div class="container">
<div class="row">
  <div class="col-md-4 bleu">bleu</div>
  <div class="rouge">rouge</div>  
</div>
    
<div class="row">
  <div class="col-md-1 bleu">bleu</div>
  <div class="rouge">rouge</div>  
</div>
    
      
<div class="row">
  <div class="col-md-9 bleu">bleu</div>
  <div class="rouge">rouge</div>  
</div>
    
</div>

Answer 2

你走在正确的轨道上。只需用 else 结束 if 语句即可。一种是使用 4 和 8，另一种是使用 12 并占据整行。

<div class="row">
   <?php if(something){ ?>
      <div class="col-md-4">
        <div> </div>
      </div>
      <div class="col-md-8">
        <div> </div>
      </div>
   <?php } else { ?>
   <div class="col-md-12">
     <div> </div>
   </div>
   <?php } ?>
</div>