如何在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>
答案 0 :(得分:0)
你需要像这样的父母<div class="form-group">
使用
<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>
&#13;
答案 1 :(得分:0)
引导工具箱中没有类可以执行此操作。
所以最好的方法是在你的行上添加top-buffer
课程。
.top-buffer{
margin-top: 40px;
}
此处为codepen:https://codepen.io/boydow/pen/ayZeGW
答案 2 :(得分:0)
您可以将“mt-#”类添加到div中以添加上边距,其中#是1-5之间的数字,长度各不相同。如果要在顶部和底部添加边距,可以执行“my-#”。该类是Bootstrap文档的一部分。
<div class="your-class mt-3">Your column</div>
答案 3 :(得分:0)
你可以使用这个:<div class="d-flex align-content-around flex-wrap">