1 复选框
<div class="checkbox checkbox-info">
<input id="checkbox4" type="checkbox">
<label for="checkbox4">
xuhaitao
</label>
</div>
2 文件上传
<div id="file-pretty">
<div class="form-group">
<label class="font-noraml control-label">文件选择(单选)</label>
<input type="file" class="form-control">
</div>
<div class="form-group">
<label class="font-noraml">文件选择(多选)</label>
<input type="file" multiple="multiple" class="form-control">
</div>
</div>
3 多选框
<div class="ibox-content">
<h3>下拉选择</h3>
<p>这个比较有名气啦,不多说</p>
<div class="form-group">
<label>基本示例</label>
<div class="input-group">
<select data-placeholder="选择省份..." class="chosen-select" style="width:350px;" tabindex="2">
<option value="">请选择省份</option>
<option value="110000" hassubinfo="true">徐海涛</option>
<option value="110000" hassubinfo="true">北京</option>
<option value="120000" hassubinfo="true">天津</option>
<option value="130000" hassubinfo="true">河北省</option>
<option value="140000" hassubinfo="true">山西省</option>
</select>
</div>
</div>
<div class="form-group">
<label class="font-noraml">多选</label>
<div class="input-group">
<select data-placeholder="选择省份" class="chosen-select" multiple style="width:350px;"
tabindex="4">
<option value="">请选择省份</option>
<option value="110000" hassubinfo="true">北京</option>
<option value="120000" hassubinfo="true">天津</option>
<option value="130000" hassubinfo="true">河北省</option>
</select>
</div>
</div>
</div>
4 表格
<tr>
<th class="">偏移(Offsets)</th>
<td colspan="4">是</td>
</tr>
<tr>
<th class="">列排序</th>
<td colspan="4">是</td>
</tr>
5
<tr>
<td class="project-status">
<span class="label label-primary">进行中
</td>
<td class="project-title">
<a href="project_detail.html">LIKE-一款能够让用户快速获得认同感的兴趣社交应用</a>
<br/>
<small>创建于 2014.08.15</small>
</td>
<td class="project-completion">
<small>当前进度: 48%</small>
<div class="progress progress-mini">
<div style="width: 48%;" class="progress-bar"></div>
</div>
</td>
<td class="project-people">
<a href="projects.html"><img alt="image" class="img-circle" src="img/a3.jpg"></a>
<a href="projects.html"><img alt="image" class="img-circle" src="img/a1.jpg"></a>
<a href="projects.html"><img alt="image" class="img-circle" src="img/a2.jpg"></a>
<a href="projects.html"><img alt="image" class="img-circle" src="img/a4.jpg"></a>
<a href="projects.html"><img alt="image" class="img-circle" src="img/a5.jpg"></a>
</td>
<td class="project-actions">
<a href="projects.html#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> 查看 </a>
<a href="projects.html#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> 编辑 </a>
</td>
</tr>
补充说明:可以在table标签外面再套一个div标签,并且为这个div标签添加project-list类
6 注意no-padding类的使用
7 添加一条水平线
<div class="hr-line-dashed"></div>
8
<div class="social-comment">
<a href="" class="pull-left">
<img alt="image" src="img/a8.jpg">
</a>
<div class="media-body">
<a href="#">
尤小右
</a> 一张图学会Javascript,via:
<br/>
<a href="#" class="small"><i class="fa fa-thumbs-up"></i> 11</a> -
<small class="text-muted">8月18日</small>
</div>