获取Bootstrap


用于生产环境的 Bootstrap

编译并压缩后的 CSS、JavaScript 和字体文件。不包含文档和源码文件。您可以直接应用在生产环境

下载 Bootstrap

Bootstrap 源码

Less、JavaScript 和 字体文件的源码,并且带有文档。需要 Less 编译器和一些设置工作以便更好的适应您的样式。

下载源码

Sass

这是 Bootstrap 从 Less 到 Sass 的源码移植项目,用于快速地在 Rails、Compass 或 只针对 Sass 的项目中引入。

下载 Sass 项目

全局CSS样式


栅格系统

Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列。它包含了易于使用的预定义类,还有强大的mixin 用于生成更具语义的布局。

排版

HTML 中的所有标题标签,h1 到 h6 均可使用。另外,还提供了 .h1 到 .h6 类,为的是给内联(inline)属性的文本赋予标题的样式。内联文本的样式,字体大小等。

代码

介绍包括内联代码,用户输入与代码块的使用与效果。

表格

为任意 table 标签添加 .table 类可以为其赋予基本的样式 — 少量的内补(padding)和水平方向的分隔线。这种方式看起来很多余!?但是我们觉得,表格元素使用的很广泛,如果我们为其赋予默认样式可能会影响例如日历和日期选择之类的插件,所以我们选择将此样式独立出来。

表单

单独的表单控件会被自动赋予一些全局样式。所有设置了 .form-control 类的 input、textarea 和 select 元素都将被默认设置宽度属性为 width: 100%。 将 label 元素和前面提到的控件包裹在 .form-group 中可以获得最好的排列。

按钮

介绍各类按钮效果,包括a标签,button标签等。

图片

介绍响应式图片,与图片形状样式。

辅助类

通过颜色来展示意图,Bootstrap 提供了一组工具类。这些类可以应用于链接,并且在鼠标经过时颜色可以还可以加深,就像默认的链接一样。

响应式工具

为了加快对移动设备友好的页面开发工作,利用媒体查询功能并使用这些工具类可以方便的针对不同设备展示或隐藏页面内容。另外还包含了针对打印机显示或隐藏内容的工具类。

使用 Less

Bootstrap 的 CSS 文件是通过 Less 源码编译而来的。Less 是一门预处理语言,支持变量、mixin、函数等额外功能。对于希望使用 Less 源码而非编译而来的 CSS 文件的用户,Bootstrap 框架中包含的大量变量、mixin 将非常有价值。

使用 Sass

虽然 Bootstrap 是基于 Less 构建的,我们还提供了一套官方支持的 Sass 移植版代码。我们将这个版本放在单独的 GitHub 仓库中进行维护,并通过脚本处理源码更新。

Bootstrap组件


Glyphicons 字体图标

包括250多个来自 Glyphicon Halflings 的字体图标。Glyphicons Halflings 一般是收费的,但是他们的作者允许 Bootstrap 免费使用。为了表示感谢,希望你在使用时尽量为 Glyphicons 添加一个友情链接。

下拉菜单

用于显示链接列表的可切换、有上下文的菜单。下拉菜单的 JavaScript 插件让它具有了交互性。

按钮组

通过按钮组容器把一组按钮放在同一行里。通过与按钮插件联合使用,可以设置为单选框或多选框的样式和行为。

按钮式下拉菜单

把任意一个按钮放入 .btn-group 中,然后加入适当的菜单标签,就可以让按钮作为菜单的触发器了。

导航

Bootstrap 中的导航组件都依赖同一个 .nav 类,状态类也是共用的。改变修饰类可以改变样式。

导航条

导航条是在您的应用或网站中作为导航页头的响应式基础组件。它们在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式。

Javascript插件


过渡效果

对于简单的过渡效果,只需将 transition.js 和其它 JS 文件一起引入即可。如果你使用的是编译(或压缩)版的 bootstrap.js 文件,就无需再单独将其引入了。

模态框

模态框经过了优化,更加灵活,以弹出对话框的形式出现,具有最小和最实用的功能集。