bootstrap

bootstrap

bootstrap</u><u>是基于HTML、CSS、Javascript开发的，在jQuery的基础上进行了更为个性化和人性化的完善，形成一套自己独有的网站风格，并兼容大部分jQuery插件。

优点：简洁灵活、使WEB开发更加快捷。

bootstrap.min.css第三方开源框架，基于UI（开放源代码）bootstrap.min.js兼容IE8浏览器

按钮

使用方法：在元素上添加样式名，前提必须添加公共类

按钮样式名:

.btn--（公共类）基础样式（带渐变的标准灰色按钮）

.btn-default 默认按钮

.btn-primary 主要按钮（视觉吸引力强，用于标识一组按钮中最主要的动作）

.btn-success 成功按钮（表示操作成功或动作正确）

.btn-warning 警告按钮（表示动作应该谨慎）

.btn-info 信息按钮（可用于替换默认样式）

.btn-danger 危险按钮（表示危险或有潜在威胁的动作）

.btn-inverse 相反按钮（做为补充的深灰色按钮，与具体行为或动作无关）

.btn-link 链接按钮

.btn-lg 大型按钮

.btn-sm 小型按钮

.btn-xs 迷你型按钮

表格

添加在table上的类：

.table 基础表格

.table-striped 斑马线表格[背景交替]

.table-bordered 带边框的表格

.table-hover 鼠标悬停显示高亮

.table-condensed 紧凑型表格

.table-responsive 响应式表格

添加在tr上的类：

.active 表示当前活动的信息

.success 表示成功或者正确的行为

.info 表示中立的信息或行为

.warning 表示警告，需要特别注意

.danger 表示危险或者错误行为

导航nav

.nav 导航公共类

.nav-tabs 基本标签页，切换性导航

.nav-pills 胶囊式导航

.nav-stacked 叠放式导航（与nav-tabs/nav-pills使用）

.nav-list 列表导航

.dropdown 加给li表示下拉样式导航

.breadcrumb 面包屑导航

文本对齐

.text-left 文字左对齐

.text-right 文字右对齐

.text-center 文字居中对齐

.text-justify 两端对齐

.text-wrap 文本换行

.text-nowrap 文本不换行

进度条

给父元素添加progress类

子元素添加 progress-bar 类

父元素追加 progress-striped 显示斑马纹

父元素追加 active 类显示斑马线动画

通知栏/警告框

父元素添加 alert类

.alert-error 危险/错误

.alert-success 成功

.alert-info 信息

父元素追加alert-block 提供更大的padding值

子元素a标签添加close 类创建关闭按钮

栅格系统

lg：1220以上

md中屏：992-1220

xs :768以下

sm：768-992