我有这个代码:
<div class="well">
<form role="form" id="shop-order" method="post" action="">
<div class="row">
<div class="form-group">
<div class="col-md-3">
<div class="pull-right">
<label for="name">Label</label>
</div>
</div>
<div class="col-md-6">
<select class="form-control" name="clientId">
$options
</select>
</div>
</div>
</div>
// possibly other rows...
</div>
这段代码的结果在这张图片上:
我不明白如何将标签和输入居中。我希望它们在一条线上:标签中间与输入中间相对。
我该怎么做?或者我的 html 可能是错误的,这可以通过正确的 html 来实现?
我正在寻找 Bootstrap 方法,据我所知,它可以通过 line-height
实现. 我会在 line-height
之前完成如果我找不到 Bootstrap 解决方案。所以我正在寻找 Bootstrap 解决方案。
Bootstrap 提供了一种Horizontal Forms 样式,看起来就像您正在寻找的样式:http://getbootstrap.com/css/#forms-horizontal
工作 fiddle :http://jsfiddle.net/Nv9Q5/1/
代码:
<div class="well">
<form class="form-horizontal">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">ФИО Клиента</label>
<div class="col-sm-10 col-md-10">
<select class="form-control" name="clientId">
<option>one</option>
</select>
</div>
</div>
</form>
</div>
我是一名优秀的程序员,十分优秀!