我的问题是“类别”按钮和带有“开始!”的输入栏按钮彼此不在同一行。
这是一个代码片段:
<form class="form" role="form">
<div class="form-group">
<div class="btn-group">
<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
Category <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-3">
<div class="input-group">
<input type="text" class="form-control">
<span class="input-group-btn">
<button class="btn btn-info" type="button">Go!</button>
</span>
</div><!-- /input-group -->
</div><!-- /.col-lg-6 -->
</div><!-- /.row -->
</div>
</form>
这是它目前的样子:
如您所见,它们都在不同的行上。
最佳答案
我觉得你应该写
<form class="form-inline" role="form">
....
</form>
如果您在 css 文件中编写表单类 (.form)。然后好吧。因为我认为 Bootstrap.css 中没有任何名称为 Form(.form) 的类。这是
第一。
<form></form>
第二。
<form class = "form-inline"></form>
第三。
<form class = "form-horizontal"></form>
关于html - Bootstrap 表单组不是内联的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22310535/