普通表单

竖排表单

					
<form>
	<h3>竖排表单</h3>
	<div class="form-group">
		<label for="userEmail">邮箱</label>
		<input type="email" class="form-control" id="userEmail" placeholder="邮箱">
	</div>
	<div class="form-group">
		<label for="userPassword">密码</label>
		<input type="password" class="form-control" id="userPassword" placeholder="密码">
	</div>
	<div class="checkbox">
		<label for="rememberPassword">
			<input type="checkbox" id="rememberPassword"> 记住密码
		</label>
	</div>
	<button type="submit" class="btn btn-default">提交</button>
</form>
					
				

内联表单

					
<form class="form-inline">
	<h3>内联表单</h3>
	<div class="form-group">
		<label for="userEmail">邮箱</label>
		<input type="email" class="form-control" id="userEmail" placeholder="邮箱">
	</div>
	<div class="form-group">
		<label for="userPassword">密码</label>
		<input type="password" class="form-control" id="userPassword" placeholder="密码">
	</div>
	<div class="checkbox">
		<label for="rememberPassword">
			<input type="checkbox" id="rememberPassword"> 记住密码
		</label>
	</div>
	<button type="submit" class="btn btn-default">提交</button>
</form>
					
				

水平表单

					
<form class="form-horizontal">
	<h3>水平表单</h3>
	<div class="form-group">
		<label for="userEmail" class="col-sm-2 control-label">邮箱</label>
		<div class="col-sm-10">
			<input type="email" class="form-control" id="userEmail" placeholder="邮箱">
		</div>
	</div>
	<div class="form-group">
		<label for="userPassword" class="col-sm-2 control-label">密码</label>
		<div class="col-sm-10">
			<input type="password" class="form-control" id="userPassword" placeholder="密码">
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<div class="checkbox">
				<label for="rememberPassword">
					<input type="checkbox" id="rememberPassword"> 记住密码
				</label>
			</div>
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<button type="submit" class="btn btn-default">提交</button>
		</div>
	</div>
</form>
					
				

额外元素

邮箱
密码
					
<form class="form-horizontal">
	<h3>额外元素</h3>
	<div class="form-group">
		<div class="input-group col-sm-offset-1 col-sm-10">
			<span class="input-group-addon" id="userEmail2">邮箱</span>
			<input type="email" class="form-control" id="userEmail" placeholder="请输入邮箱地址" aria-describedby="userEmail2">
		</div>
	</div>
	<div class="form-group">
		<div class="input-group col-sm-offset-1 col-sm-10">
			<span class="input-group-addon" id="userPassword2">密码</span>
			<input type="password" class="form-control" id="userPassword" placeholder="请输入密码" aria-describedby="userPassword">
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<div class="checkbox">
				<label for="rememberPassword">
					<input type="checkbox" id="rememberPassword"> 记住密码
				</label>
			</div>
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<button type="submit" class="btn btn-default">提交</button>
		</div>
	</div>
</form>
					
				

选择框

邮箱
密码
类型
					
<form class="form-horizontal">
	<h3>选择框</h3>
	<div class="form-group">
		<div class="input-group col-sm-offset-1 col-sm-10">
			<span class="input-group-addon" id="userEmail2">邮箱</span>
			<input type="email" class="form-control" id="userEmail" placeholder="请输入邮箱地址" aria-describedby="userEmail">
		</div>
	</div>
	<div class="form-group">
		<div class="input-group col-sm-offset-1 col-sm-10">
			<span class="input-group-addon" id="userPassword">密码</span>
			<input type="email" class="form-control" id="userPassword" placeholder="请输入密码" aria-describedby="userEmail">
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<div class="checkbox">
				<label>
					<input type="checkbox"> 选项一
				</label>
			</div>
			<div class="checkbox">
				<label>
					<input type="checkbox"> 选项二
				</label>
			</div>
			<div class="checkbox">
				<label>
					<input type="checkbox"> 选项三
				</label>
			</div>
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<div class="radio">
				<label>
					<input type="radio" name="radio" value="1">选项1
				</label>
			</div>
			<div class="radio">
				<label>
					<input type="radio" name="radio" value="2">选项2
				</label>
			</div>
			<div class="radio">
				<label>
					<input type="radio" name="radio" value="3">选项3
				</label>
			</div>
		</div>
	</div>
	<div class="form-group">
		<div class="input-group col-sm-offset-1 col-sm-10">
			<span class="input-group-addon">类型</span>
			<select class="form-control">
				<option>1</option>
				<option>2</option>
				<option>3</option>
				<option>4</option>
				<option>5</option>
			</select>
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<button type="submit" class="btn btn-default">提交</button>
		</div>
	</div>
</form>