<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<form class="form-horizontal">
<!--通过为表单添加 .form-horizontal 类，并联合使用 Bootstrap 预置的栅格类，可以将 label 标签和控件组水平并排布局。-->
<label class="col-md-2 control-label">Email</label>
<!--control-label 文本右对齐，一般不建议使用，因为不好看-->
<div class="col-md-10">
<input type="email" class="form-control">
</div>
<!--包括大部分表单控件、文本输入域控件，还支持所有 HTML5 类型的输入控件： text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel 和 color。--><textarea class="form-control" rows="3"></textarea>
</form>
<form>
<!--标准样式-->
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<!--对于标记了 multiple 属性的 <select> 控件来说，默认显示多选项-->
<select multiple class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</form>
<form class="form-horizontal">
<div class="form-group">
<label class="col-md-2">Email</label>
<div class="col-md-10">
<!--如果需要在表单中将一行纯文本和 label 元素放置于同一行，为 <p> 元素添加 .form-control-static 类即可-->
<p class="form-control-static">sxt@163.com</p>
</div>
</div>
</form>
</div>
</body>
</html>
