按钮：
<button class="btn btn-success" value="成功">success</button>
<button class="btn btn-default" href="#" role="button">default</button>
<button class="btn btn-info">info</button>
<button class="btn btn-danger">danger</button>
<button class="btn btn-active">active</button>
<button class="btn btn-disable">disable</button>
图片：
<img src="./images/logo.png" class="img-rounded" > 小圆角
<img src="./images/logo.png" class="img-circle"> 椭圆
<img src="./images/logo.png" class="img-thumbnail" > 带白框
文本框：
<div class="input-group" style="width:300px;margin:10px 0;">
<input type="text" class="form-control" placeholder="带提示文本框">
</div>
<div class="input-group" style="width:300px;"> 常用表单
<span class="input-group-addon">文件名</span>
<input type="text" class="form-control" placeholder="带提示文本框">
<span class="input-group-addon">$</span>
</div>
<div class="input-group" style="width:300px;margin:10px 0;"> 搜索框
<input type="text" class="form-control">
<span class="input-group-btn">
<button class="btn btn-default" type="submit">提交</button>
</span>
</div>
表单
<form action="" class="form-horizontal" role="form" style="width:500px">
<div class="form-group">
<label class="col-sm-2 control-label">名字</label>
<div class="col-sm-10">
<input type="text" class="form-control" placeholder="请输入名字">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">密码</label>
<div class="col-sm-10">
<input type="password" class="form-control" placeholder="请输入密码">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">爱好</label>
<div class="col-sm-10">
<label class="checkbox-inline">
<input type="checkbox" value="打球">打球
</label>
<label class="checkbox-inline">
<input type="checkbox" checked value="看书">看书
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">性别</label>
<div class="col-sm-10">
<label class="checkbox-inline" style="text-indent: -20px;">
<input type="radio" value="打球">男
</label>
<label class="checkbox-inline" style="text-indent: -20px;">
<input type="radio" checked value="看书">女
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">城市</label>
<div class="col-sm-10">
<select name="" id="" class="form-control">
<option value="">广州</option>
<option value="">上海</option>
<option value="">深圳</option>
<option value="">北京</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">城市</label>
<div class="col-sm-10">
<textarea name="" id="" cols="30" rows="10" class="form-control">
</textarea>
</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-inline" role="form">
<div class="form-group">
<label class="sr-only" for="name">名称</label>
<input type="text" class="form-control" id="name" placeholder="请输入名称">
</div>
<div class="form-group">
<label class="sr-only" for="inputfile">文件输入</label>
<input type="file" id="inputfile">
</div>
<div class="checkbox">
<label>
<input type="checkbox">请打勾
</label>
</div>
<button type="submit" class="btn btn-default">提交</button>
</form>
图标库：
http://www.runoob.com/try/demo_source/bootstrap3-glyph-icons.htm ／／内置小图标
http://www.bootcss.com/p/font-awesome/#icons-web-app //引入小图标
http://www.iconfont.cn/collections/index?spm=a313x.7781069.1998910419.3 //阿里云图标库
tab栏目
<ul class="nav nav-tabs">
<li><a href="">111</a></li>
<li><a href="">222</a></li>
<li><a href="">333</a></li>
</ul>
导航栏
<div class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<a href="" class="navbar-brand">科技公司</a>
</div>
<div>
<ul class="nav navbar-nav">
<li class="active"><a href="">首页</a></li>
<li><a href="">新闻</a></li>
<li><a href="">关于我们</a></li>
</ul>
</div>
</div>
面包屑标签
<ul class="breadcrumb">
<li><a href="">首页</a></li>
<li><a href="">新闻</a></li>
<li><a href="">关于我们</a></li>
</ul>
分页
<ul class="pagination">
<li><a href=""><<</a></li>
<li><a href="">1</a></li>
<li><a href="">2</a></li>
<li><a href="">3</a></li>
<li><a href="">>></a></li>
</ul>