<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-theme.css">
<script src="bootstrap/js/jquery-3.2.1.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<style>
</style>
</head>
<body>
<form>
<div class="container">
<!--输入框-->
<div class="form-group">
<label for="tel">手机号</label>
<input type="input" name="tel" id="tel" class="form-control">
</div>
<div class="form-group">
<label for="password">密码</label>
<input type="input" name="tel" id="password" class="form-control">
</div>
<!--复选框-->
<div class="form-group">
<label class="checkbox-inline"><input type="checkbox" name="hobby">唱歌</label>
<label class="checkbox-inline"><input type="checkbox" name="hobby">唱歌</label>
<label class="checkbox-inline"><input type="checkbox" name="hobby">唱歌</label>
</div>
<!--单选框-->
<div class="form-group">
<label class="radio-inline"><input type="radio" name="sex" value="男">男</label>
<label class="radio-inline"><input type="radio" name="sex" value="女">女</label>
</div>
<!--输入框组-->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">搜索</span>
<input type="text" name="search" class="form-control">
</div>
</div>
<div class="form-group">
<div class="input-group">
<input type="text" name="search" class="form-control">
<span class="input-group-addon">搜索</span>
</div>
</div>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-user"></span>
</span>
<input type="text" name="username" class="form-control">
</div>
</div>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-lock"></span>
</span>
<input type="password" name="username" class="form-control">
</div>
</div>
</div>
</form>
</body>
</html>
