兼容ie:<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
移动设备: <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!--[if lt IE 9]>
<script src="/assets/js/html5shiv.js"></script>
<script src="/static/assets/js/respond.min.js"></script>
<![endif]-->
网格：
超小设备 小型设备 中型设备 大型设备
宽度：col-xs .col-sm .col-md .col-lg
偏移：col-md-offset-1
排序：col-md-push
col-md-
pull
排版：
<h1><h1><small><small><h1> .lead
<blockquote>
</blockquote> .initialism 缩写
list-inline
list-unstyled
containter 居中
containter-fluid 流式布局
page-header 头
page-body
row 行
span 块
表格类
.table
.table-bordered .table-hover
.table-striped 内添加斑马线形式的条纹 ( IE8 不支持)
.active .success .info .warning .danger
表单
垂直表单：role="form" .form-group .form-control
内联并排表单： .form-inline role="form" .form-group .form-control
水平表单(lable、input元素在同一行)：
.form-horizontal role="form" .form-group .control-label .form-control
单选择框 radio 与checkbox
垂直： checkbox checkbox radio radio
内联: checkbox-inline radio-inline
选择框 select: .
multiple 可多选
静态控件
.form-control-static
focus 获取焦点
disabled 禁用
按钮：
.btn .btn-default .btn-primary .btn-success .btn-info .btn-warning .btn-danger .btn-link
.active .disabled
.btn-lg .btn-sm .btn-xs .btn-block
大小：.input-lg .input-sm <span class="help-block"></span>标签label label-default label-primary label-success label-info label-warning label-danger图片.img-rounded 添加圆角 .img-circle 圆形.img-thumbnail 添加一些内边距（padding）和一个灰色的边框.img-responsive
文本：.text-left .text-center .text-right .text-muted .text-primary .text-success .text-info .text-warning .text-danger背景：.bg-primary .bg-success .bg-info .gb-waning .bg-danger提示警告 alert-success alert-info alert-warning alert-danger alert-dismissable
< code>< pre> 显示代码.text-hide 将页面元素所包含的文本内容替换为背景图 .close 显示关闭按钮 .caret 显示下拉式功能 caret 插入符
下拉菜单：.
按钮组：.btn-group .btn-toolbar .btn-group-vertical 垂直堆叠显示
按钮下拉：input-group-addon
导航：nav nav-tables nav-pills(胶囊样式)nav-stacked .nav-justified disabled导航栏：.navbar navbar-default role="navigation" nav navbar-navnavbar-inverse面包屑 .breadcrumb 徽章 badge大屏幕 jumbotron缩略图.thumbnail进度条 progress-bar多媒体 media
面板 panel panel-heading panel-body panel-info panel-success panel-error well列表组 list-group list-group-item
模拟框Modal
下拉菜单（Dropdown）
滚动监听（Scrollspy）
标签页（Tab）
提示工具（Tooltip）
弹出框（Popover）
警告框（Alert）
按钮（Button）插件
折叠（Collapse）
轮播（Carousel）
附加导航（Affix）
旋转木马carousel-inner折叠内容collapse选项卡：table-pbreadcrmb 导航路径分页器ul/li
-----------modal 对话框----------------------------<a href="page.html" data-toggle="modal" data-targer-"#mymodel">弹出</a>
<div id="mymodal" class="modal hide fade"><div class="modal-header"><button type="btn" class="colose" data-dismiss="modal"></button><h3>对话框标题<h3></div><div class="modal-body"><p>对话框主题</p></div><div class="modal-footer"><a href="btn" data-dismiss="modal">取消</a><a href="#" class="btn btn-primary" data-dismiss = "modal">确定</a><div></div>
<!-- 按钮触发模态框 -->
<button class="btn btn-primary btn-lg" data-toggle="modal"
data-target="#myModal">
开始演示模态框
</button>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close"
data-dismiss="modal" aria-hidden="true">
×
</button>
<h4 class="modal-title" id="myModalLabel">
模态框（Modal）标题
</h4>
</div>
<div class="modal-body">
在这里添加一些文本
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default"
data-dismiss="modal">关闭
</button>
<button type="button" class="btn btn-primary">
提交更改
</button>
</div>
</div><!-- /.modal-content -->
</div>
<!-- /.modal -->
--------左右 可切换式标签页
<ul
class
=
"nav nav-tabs"
id
=
"myTab"
>
<li
class
=
"active"
><a
href
=
"#home"
>
首页
</a></li>
<li><a
href
=
"#profile"
>
Profile
</a></li>
</ul>
<div
class
=
"tab-content"
>
<div
class
=
"tab-pane active"
id
=
"home"
>
...
</div>
<div
class
=
"tab-pane"
id
=
"profile"
>
...
</div>
</div>
--------弹出提示
--------警告
------------------
<a
class
=
"close"
data-dismiss
=
"alert"
href
=
"#"
>
×
</a>
--------上下折叠---------------------------------
<button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo">
simple collapsible
</button>
<div id="demo" class="collapse in"> … </div>
左侧导航
</ul><a href="#articleMenu" class="nav-header collapsed" data-toggle="collapse"><i class="icon-book icon-large"></i> 文章管理</a><ul id="articleMenu" class="nav nav-list collapse"><li><a href="#"><i class="icon-pencil"></i> 添加文章</a></li><li><a href="#"><i class="icon-list-alt"></i> 文章列表</a></li></ul></div>
2583
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
