BootStrap-CSS选项列表大全

将以前学习的总结整理下：以下是BootStrap-CSS选项大全

手风琴效果

accordion

accordion-group

accordion-headin 

accordion-inner

accordion-toggle

active 选中状态

add-on

弹出提示信息

Alert

Alert-heading

Alert-block

Alert-danger

Alert-error

Alert-success

Alert-info

Arrow 出现一个箭头

Bar

Brand  商标效果

Breadcrumd 面包屑，提示在网站那个位置

按钮效果

Btn

Btn-group  它的元素下可设置多个btn

Btn-dark

Btn-primary

Btn-inverse  黑色

Btn-info

Btn-danger

Btn-warning

Btn-success

Btn-mini

Btn-small

Btn-large

Btn-navbar

Btn-toolbar

Caption 标题效果

Caret 插入符号

图片循环展示

Carousel

Carousel-inner

Carousel-caption

carousel-control  data-slide='前一张'

Checkbox 复选框效果

Clearfix

Close 在alert中显示‘x’按钮

Collapse

显示框

Container

Container-fluid

Control-group

Control-label

Controls

Disabled 使得元素不能点击，点击没有效果

Divider           相当于<hr />

Divider-vertical

点击按钮出现，下面弹出另一个

Dropdown

Dropdown-toggle  data-toggle=“dropdown”

Dropdown-menu

Fade     隐藏

In       显示

对表单处理

Form-actions

Form-inline 表单中的元素水平显示

Form-horizontal 垂直显示

Form-search     搜索框

 

Help-block      提示信息，在表单中用到，如’请输入至少5个字符‘

Help-inline

 

Hero-unit      相当于报纸头版效果

 

Hide          隐藏元素

 

Icon-*        小图标,*表示很多，用到的时候再找对应的

 

对input的处理

Input-append

Input-prepend

Input-mini

Input-small

Input-medium  中等大小

Input-large

Input-xlarge

Input-xxlarge

Uneditable-input

Uneditable-textarea

 

Invisible       隐藏

Item            一项

 

标签

Label

Label-important

Label-success

Label-info

Label-warning

Large           大

 

Lead

 

点击一个元素，弹出一个窗口即modal

Modal        data-toggle=’modal‘

Modal-backdrop     modal的背景

Modal-header       modal的头部

Modal-body

Modal-footer

Modal-form

Modal-open

 

Muted          无声的,使文本柔和显示

 

导航效果

Nav

Nav-collapse

Nav-header

Nav-list

Nav-fills

Nav-tabs

Nav-stacked

 

Navbar  包含一个或多个nav

Navbar-fixed-top      固定到网页头部

Navbar-inner

Navbar-form          嵌入表单，如：注册输入框

Navbar-header

Navbar-text

Navbar-search

 

Next          下一个

Offset1-offset11      间隔

Open

分页处理

Page-header

Pager

Pagination      数值页码

Pagination-centered

Pagination-right

Previous        上一个

Prev

 

Pill-content    pill 药丸，子弹

Pill-pane       pane 窗格

 

Tab-content    tab 标签，制表，账单

Tab-pane

Tabbable

 

Tabs-below

Tabs-left

Tabs-right

Tabs-stacked

 

Popover

Popover-content

Popover-title

Popover-inner

 

Pre-scrollable

 

Prettyprint

 

滚动条效果

Progress

Progress-info

Progress-success

Progress-danger

Progress-striped  带条纹

 

Pull-left        布局的，到左边

Pull-right

 

Radio

 

行效果,布局用的

Row

Row-fluid

 

Search-query

 

Show

 

Span1-span12         相当于td,数值表示大小，即’列‘效果

 

表格处理

Table

Table-bordered

Table-condensed condensed 浓缩的，扼要的

 

产生个圆边框效果

Thumbnail

Thumbnails

 

tooltip

Tooltip-arrow

Tooltip-inner

 

Typeahead      <input type="text" data-provide="typeahead">

 

 

 

Unstyled

 

Well      

 

上面是class的值，或rel的值，等等，还有待深入研究

 

元素的属性

Data-spy

Data-target     相当于href，指定跳转到的位置

Data-toggle     激活对应js中的方法

Data-offset     还不知道

Data-content

Data-dismiss

Data-loading-text

Data-*-text

Data-parent     该元素的父元素

Data-slide      跳转 data-slide="prev" data-slide="next"

Data-provide    dataprovide="typeahead"

Data-items

Data-source      接受一个数组为值