bootstrap 使用（二）

bootstrap核心可以分为三部分：
（1）全局CSS样式
（2）组件
（3）JavaScript插件

全局CSS样式

1、概览
需要h5
2、栅格系统
3、文本
4、代码

5、表格
（1）基本：table.table
（2）条纹状表格：table.table-striped
（3）边框表格：table.table-bordered
（4）鼠标悬停：table.table-hover
（5）紧缩表格：table-table-condensed
（6）行或列状态：.active、.success、.info、.warning、.danger
（7）响应式表格：div.table-responsive>table.table

6、表单
（1）基本的

• form-control类的input、textarea和select元素会被设置为宽带100%
• 一般在div.form-group中配置label标签和input标签，label标签的for属性指向input标签的id属性。
  （2）内联表单：form.form-inline
  （3）水平排列的表单：form.form-horizontal
  （4）支持的控件：包括大部分表单控件、文本输入域控件，还支持所有 HTML5 类型的输入控件： text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel 和 color。
• 文本域：可以设置rows属性
• 单选框和多选框
• 单选和多选的内联
• 下拉列表
  （5）静态控件：为p元素添加form-control-static类
  （6）焦点状态 :focus
  （7）禁用状态
  （8）fieldset：禁用内部所有
  （9）只读状态 readonly
  （10）校验状态
  （11）额外图标
  （12）控件尺寸

7、按钮
（1）支持
为a、input和button添加类，即可
但导航和导航条组件只支持button元素
如果 <a> 元素被作为按钮使用 -- 并用于在当前页面触发某些功能 -- 而不是用于链接其他页面或链接当前页面中的其他部分，那么，务必为其设置 role="button" 属性。

<a class="btn btn-default" href="#" role="button">Link</a>
<button class="btn btn-default" type="submit">Button</button>
<input class="btn btn-default" type="button" value="Input">

（2）预定样式
btn-default：默认
btn-primary：首选项
btn-success：成功
btn-info：一般信息
btn-warning：警告
btn-danger：危险
btn-link：链接
（3）尺寸
btn-lg：大按钮
btn-sm：小按钮
tbn-xs：超小按钮
btn-block：将其拉伸至父元素100%的宽度，而且按钮也变为了块级（block）元素。
（4）激活
active：其表现为被按压下去（底色更深、边框夜色更深、向内投射阴影）。
（5）禁用
按钮：

disabled="disabled"

链接：
disabled类
8、图片
（1）响应式图片

<img src="..." class="img-responsive" alt="Responsive image">

（2）图片形状

.img-rounded
.img-circle
.img-thumbnail