我只是在使用Boostrap进行学习和编码,我想的布局是这样的:
Row
<SmallerColumn that hold label 1> <Larger Column that hold the control 1>
<SmallerColumn that hold label 2> <Larger Column that hold the control 2>
EndRow
例如,combobox
和label
说明了什么是conmbox。
例如:国家/地区:国家组合
答案 0 :(得分:1)
这个问题非常简单,但是对于初学者来说有点混乱,不要惹恼它,只需要快速阅读Bootstrap关于form control布局的文档。
布局的摘录如下:
_1
不需要.row作为.form-group将处理新添加的元素。
答案 1 :(得分:1)
form-horizontal
类引导程序。但是form-group
类将处理不同的行。但是使用form-control
类会导致您在文本周围有一个边框:
为了没有边框,使用control-label
作为类。
试试这段代码:
<div class="form-horizontal">
<div class="form-group">
<label class="control-label col-sm-2">Islands:</label>
<div class="col-sm-10">
<label class="control-label" id="l1" >Combobox of Islands 1</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Countries:</label>
<div class="col-sm-10">
<label class="control-label" id="l2" >Combobox of Countries 1</label>
</div>
</div>
</div>
这是一个jsfiddle:https://jsfiddle.net/mayank_shubham/an197vva/