bootstrap 学习网站：点击打开链接
最基本的东西：
1>使用bootstrap要引入的css与js文件
<%@ page language="java" contentType="text/html; charset="UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html><head><title>bootstrap</title><link rel="stylesheet" href="<%=request.getContextPath()%>/css/common/bootstrap/min.css"><!-- jQuery文件。务必在bootstrap.min.js 之前引入 --><script type="text/javascript" src="<%=request.getContextPath()%>/js.commom/jquery-2.2.0.min.js"></script><script type="text/javascript" src="<%=request.getContextPath()%>/js/common/bootstrap/min.js"></script></head><body></body></html>
<%=request.getContextPath()%>可返回站点的根路径
得到工程文件的实际物理路径：<%=request.getRealPath("/")%>
2>表单
<!-- 基本表单和垂直表单
向<form>元素添加 role="form";
标签和控件放带有clss.form-group的<div>.这是获取最佳间距所必须的
向<input><textarea><select>添加class.form-control
-->
<!-- 水平表单
向<form>元素添加class.form-horizontal
标签和控件放带有clss.form-group的<div>
向标签添加class.control-label
-->
其中需要注意的是：格式是这样的
<form class="form-horizontal" role="form">
<div class="control-group">
<label class="col-sm-2 control-label">
</label>
<div class="col-sm-10">
<input class="form-control"/>
</div>
</div>
</form>
上面 col-sm-2,这是规定对其的列数，一共有12列；
xs、sm、md 还是 lg四种分别对应四种主流的屏幕宽度：手机、平板、笔记本、电脑宽屏
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>bootstrap</title>
<link rel="stylesheet" href="./css/common/bootstrap.min.css">
<script type="text/javascript" src="./js/common/bootstrap.min.js"></script>
<script type="text/javascript" src="./js/common/jquery-2.2.0.min.js"></script>
</head>
<body>
<!-- eg(水平表单)： -->
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="koko" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="text" id="koko" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">选择文件</label>
<div class="col-sm-2">
<input type="file" id="inputfile" class="form-control">
<p class="help-block">这里是块级帮助文本的实例</p>
</div>
</div>
</form>
</body>
</html>