我正在使用带有form-horizonal的Bootstrap 3。我正在使用form-group，如下例HTML所示。span未与输入控件内联，这是使用form-horizonal所期望的。
<form name="productForm" class="form-horizontal">
<div class="col-lg-6">
<div class="form-group">
<span class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="text-align:right;">Number</span>
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
<input type="text" class="form-control control-look-input" />
<div class="control-look"></div>
</div>
</div>
<div class="form-group">
<span class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="text-align:right;">Name</span>
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
<input type="text" class="form-control control-look-input" />
<div class="control-look"></div>
</div>
</div>
</div>
<!-- More tags -->
null
为了更好地理解这是它的小提琴
参考解决方案：在span中引用control-label类，使其像fiddle一样工作
您所需要做的只是将span更改为label，并将其置于保存输入的div上方，如下代码所示：
null
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<form name="productForm" class="form-horizontal">
<div class="form-group">
<label for="number" class="col-sm-2 control-label">Number</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="number" placeholder="Enter your Number...">
</div>
</div>
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" placeholder="Enter your Name...">
</div>
</div>
</form>