Bootstrap4如何创建水平表单(Horizontal form)
bootstrap3提供form-horizontal方式创建水平表单，而bootstrap4去掉了该类定义。
常用的处理方式有二种：
第一种：在<form></form>中定义<div class="form-row"> </div>
然后在form-row下定义列宽（class="col-*-*"）。
<form>
<div class="form-row">
<div class="col">
<input type="text" class="form-control" placeholder="First name">
</div>
<div class="col">
<input type="text" class="form-control" placeholder="Last name">
</div>
</div>
</form>
再复杂一点的可以在form-row下再定义form-group，在form-group中定义列宽，即把每个form-group当做列处理，而当form-group中再有多个元素时，这些元素会在form-group内部再以堆叠的形式展现（如果页面需要达到这种效果），如下所示：
<form>
<div class="form-row">
<div class="form-group col-md-1">
<label for="i_name">昵称</label>
<input type="text" class="form-control" id="i_name">
</div>
<div class="form-group col-md-2">
<label for="i_pswd">密码</label>
<input type="text" class="form-control" id="i_pswd">
</div>
...// 省略其它form-group
</div>
</from>
另外：
bootstrap4新增的.form-row（使左、右外边距向内收5px，margin-right: -5px;margin-left: -5px;），其本意是替换.row的使用（左、右外边距内收15px，margin-right: -15px;margin-left: -15px;）。
form-row与row样式比较：
.form-row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -5px;
margin-left: -5px;
}
.row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
margin设置为负值是让其它元素进入到该元素的border里面，使元素之间看起来更紧凑。
第二种方法：
<form></form>元素上不定义样式，.form-group样式增加.row或者.form-row，使.form-group做为行，对其下的label和controls定义列宽（col-*-*），需要注意的是：所有label标签必须添加.col-form-label样式（.col-form-label，.col-form-label-lg，.col-form-label-sm，设置padding-top和padding-bottom的高度）
<form>
<div class="form-group row">
<label for="inputEmail3" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email">
</div>
</div>
<div class="form-group row">
<label for="inputPassword3" class="col-sm-2 col-form-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
...省略其它form-group
</form>
更多详细用法参考官网：https://v4.bootcss.com/docs/4.0/components/forms/