bootstrap之学习笔记

form-inline:

   用于强行将多个form-group div放在一行（禁止换行）里面。

案例：

<div class="form-inline">
	<div class="form-group">
	 <label>username:</label>
	  <input type="text" class="form-control" name="username" placeholder="please input username" value="" />
	</div>
	<div class="form-group">
     <label>password:</label>
	 <input type="password" class="form-control" name="password" placeholder="please input password" />
	</div>
</div>

效果（用之后）：

用之前：

 

form-horizontal：

  用于表单元素的对齐（有些时候元素对不齐、不换行、让div水平排列）

案例：

<div class="form-horizontal">
	<div class="form-group">
		<label class="col-md-2 control-label">username:</label>
		<div class="col-md-5">
			<input class="form-control" type="text" placeholder="please input username" />
		</div>
	</div>
	<div class="form-group">
		<label class="col-md-2 control-label">password:</label>
		<div class="col-md-5">
			<input class="form-control" type="password" placeholder="please input password" />
		</div>
	</div>
</div>

效果（用后）：

用之前：

<span class="input-group-addon">***</span>

  用于将***追加、紧贴到临近的输入框的后面/前面

效果：