1.form如果想改为横向的,在最外部的div或者form中增加class="form-inline",就可以变为横向的。
2.如果想要单独对input设为一行2个类似的,左边加上width: 45%;float: left;,右边加上width: 45%;float: left;margin-left: 10%;
3.想将该form的位置,大小等进行调整,只需要在外部加一个div对其进行控制即可。
4.实例如下:
<div style="width: 90%;margin-left: 5%;">
<!-- <form> -->
<!-- <form class="form-inline"> -->
<div class="form-group" style="width: 45%;float: left;">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" placeholder="Email">
</div>
<div class="form-group" style="width: 45%;float: left;margin-left: 10%;">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" placeholder="Password">
</div>
<div class="form-group">
<label for="exampleInputFile">File input</label>
<input type="file">
<p class="help-block">Example block-level help text here.</p>
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Check me out
</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
<!-- </form> -->
</div>
实例效果: