Bootstrap常见组件的类名-CSS

表格

• <table>
  .table：为任意 <table> 添加基本样式 (只有横向分隔线)
  .table-striped：在 <tbody> 内添加斑马线形式的条纹
  .table-bordered：为所有表格的单元格添加边框
  .table-hover ：在 <tbody> 内的任一行启用鼠标悬停状态
  .table-condensed：让表格更加紧凑
• <tr>,<th>,td>类
  .active：将悬停的颜色应用在行或者单元格上
  .success：表示成功的操作
  .info：表示信息变化的操作
  .warning：表示一个警告的操作
  .danger：表示一个危险的操作

表单

• 垂直表单（默认）
  创建基本表单的步骤：
  （1）向父元素 <form> 添加 role=“form”。
  （2）把标签和控件放在一个带有 class .form-group 的 <div> 中。
  （3）向所有的文本元素 、 和 添加 class =“form-control” 。
• 内联表单 向父元素 <form> 添加 class .form-inline。
• 水平表单
  创建一个水平布局的表单：
  （1）向父元素<form>添加 class .form-horizontal。
  （2）把标签和控件放在一个带有 class .form-group 的 <div> 中。
  （3）向标签添加 class .control-label。

按钮

• 按钮样式
  .btn：为按钮添加基本样式
  .btn-default：默认/标准按钮
  .btn-primary ：原始按钮样式（未被操作）
  .btn-success：表示成功的动作
  .btn-info：该样式可用于要弹出信息的按钮
  .btn-warning：表示需要谨慎操作的按钮
  .btn-danger：表示一个危险动作的按钮操作
  .btn-link：让按钮看起来像个链接 (仍然保留按钮行为)
• 按钮大小
  .btn-lg：制作一个大按钮
  .btn-sm：制作一个小按钮
  .btn-xs：制作一个超小按钮
  .btn-block：块级按钮(拉伸至父元素100%的宽度)
• 按钮状态
  .active：按钮被点击
  .disabled：禁用按钮

图片

• <img>类
  .img-rounded：为图片添加圆角
  .img-circle：将图片变为圆形
  .img-thumbnail：缩略图功能
  .img-responsive：图片响应式

其他辅助类

.pull-left：元素浮动到左边
.pull-right ：元素浮动到右边
.center-block：设置元素为 display:block 并居中显示
.clearfix：清除浮动
.show：强制元素显示
.hidden：强制元素隐藏
.sr-only：除了屏幕阅读器外，其他设备上隐藏元素
.sr-only-focusable：与 .sr-only 类结合使用，在元素获取焦点时显示
.text-hide ：将页面元素所包含的文本内容替换为背景图
.close：显示关闭按钮
.caret：显示下拉式功能