フィールド間に垂直スペースを追加するブートストラップ方法

Question

divの間に垂直スペースを追加するにはどうすればよいですか？ここに追加できるブートストラップクラスはありますか？ 助けてください？ブートストラップツールボックスには、クラスにはありません

<div class="row"> 
    <div class="col-md-6"> 
     <div class="form-group"> 
      <label class="control-label col-lg-4"> Project: </label> 
      <div class="col-lg-8"> 
       @Html.TextBoxFor(model => model.detailsConfig.Project, new { onkeypress = "return isNumberKey(event)", @class = "form-control", id = "Project" }) 
      </div> 
     </div> 
    </div> 
</div> 

<div class="row"> 
    <div class="col-md-6"> 
     <div class="form-group"> 
      <label class="control-label col-lg-4">Quantity:</label> 
      <div class="col-lg-8"> 
       @Html.TextBoxFor(model => model.detailsConfig.Quantity, new { onkeypress = "return isNumberKey(event)", @class = "form-control", id = "Quantity" }) 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

のように親として<div class="form-group">を使用する必要があります。以下は

は私のコードからの抜粋ですこれを行う。

あなたの行にtop-bufferクラスを追加するのが最もよい方法です。ここでcodepen

.top-buffer{ 
    margin-top: 40px; 
} 

：https://codepen.io/boydow/pen/ayZeGW

Answer 2

あなたはこの

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<div class="form-group"> 
 
<div class="row"> 
 
<div class="col-md-12"> 
 
      <div class="col-md-6"> 
 
       
 
        <label class="control-label col-lg-4"> Project: </label> 
 
        <div class="col-lg-8"> 
 
         @Html.TextBoxFor(model => model.detailsConfig.Project, new { onkeypress = "return isNumberKey(event)", @class = "form-control", id = "Project" }) 
 
        </div> 
 
        </div> 
 
      </div> 
 
      </div> 
 

 
     </div> 
 

 
    <div class="form-group"> 
 
    <div class="row"> 
 
    <div class="col-md-12"> 
 
      <div class="col-md-6"> 
 
       
 
        <label class="control-label col-lg-4">Quantity:</label> 
 
        <div class="col-lg-8"> 
 
         @Html.TextBoxFor(model => model.detailsConfig.Quantity, new { onkeypress = "return isNumberKey(event)", @class = "form-control", id = "Quantity" }) 
 
        </div> 
 
       </div> 
 
      </div> 
 
</div> 
 
      </div> 
 
     

Answer 3

あなたは＃は長さが変化する、1-5の間の数字である上マージンを追加するためにクラス「MT-＃」を追加したり、divをすることができます。上部と下部に余白を追加する場合は、「my-＃」を使用できます。このクラスはBootstrapのドキュメントの一部です。

<div class="your-class mt-3">Your column</div>