View on GitHub

下载 Bootstrap

下载 Bootstrap 以获得编译后的 CSS 和 JavaScript 文件、源码，或者通过你所喜欢的软件包管理器，例如 npm、RubyGems 等，将 Bootstrap 添加到你的项目中。

On this page

经过编译的 CSS 和 JS

下载 Bootstrap v5.3.0-alpha1 版本经过编译并立即可用的文件，以便直接用于你的项目。下载的文件包括：

编译并压缩过的 CSS 集成包（参见 CSS 文件比较）
编译并压缩过的 JavaScript 插件（参见 JS 文件比较）

不包括文档、源文件或任何可选的 JavaScript 依赖项（例如 Popper）。

下载 Bootstrap 生产文件

源文件

下载 Bootstrap 的 Sass、JavaScript 和文档源码，并使用你自己的电脑进行编译。此方式需要一些额外的工具：

Sass 编译器用于将 Sass 源文件编译为 CSS 文件
Autoprefixer 用于为某些 CSS 属性添加特定于厂商的属性前缀

Bootstrap 自带的全套构建工具已包含在源码中，它们被用来开发 Bootstrap 及其文档，但很可能不适合用到你自己的项目中。

下载 Bootstrap 源码

示例

如果你想下载并查看我们提供的示例文件，你可以通过以下链接获取经过构建的示例文件。

下载 Bootstrap 示例

使用 jsDelivr 免费 CDN

使用 jsDelivr 的话可以跳过下载文件的操作，直接在你的项目中使用 Bootstrap 编译过的 CSS 和 JS 文件。

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/mhDoLbDldZc3qpsJHpLogda//BVZbgYuw6kof4u2FrCedxOtgRZDTHgHUhOCVim" crossorigin="anonymous"></script>

如果你使用的是经过编译的 JavaScript 文件，并且希望单独引入 Popper，那么最好是在 Popper 之后引入 Bootstrap 的 JS 文件。

<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js" integrity="sha384-ep+dxp/oz2RKF89ALMPGc7Z89QFa32C8Uv1A3TcEK8sMzXVysblLA3+eJWTzPJzT" crossorigin="anonymous"></script>

软件包管理器

通过一些常用的软件包管理器可以将 Bootstrap 的 源文件 添加到任何项目中。无论使用的是哪个软件包管理器，Bootstrap 都 依赖 Sass 编译器和 Autoprefixer 以保证编译出的文件与官方的一致。

npm

在你的 Node.js 项目中安装 Bootstrap 的 npm 软件包：

npm install bootstrap@5.3.0-alpha1

const bootstrap = require('bootstrap') 或 import bootstrap from 'bootstrap' 会将所有 Bootstrap 的插件加载到一个 bootstrap 对象上。 bootstrap 模块本身导出（export）所有插件。Bootstrap 的所有 jQuery 插件都放在软件包顶级目录下的 /js/dist/*.js 中，每个插件都可以独立加载。

Bootstrap 的 package.json 文件中包含以下一些元数据信息：

sass - path to Bootstrap’s main Sass source file
style - path to Bootstrap’s non-minified CSS that’s been compiled using the default settings (no customization)

利用 npm 和我们提供的模板项目快速上手 Bootstrap！ 请前往 twbs/bootstrap-npm-starter 模板仓库，以了解如何如何在你自己的 npm 项目中构建和定制 Bootstrap。包括 Sass 编译器、Autoprefixer、Stylelint、PurgeCSS 以及 Bootstrap 图标库。

yarn

在你的 Node.js 项目中安装 Bootstrap 的 yarn 软件包：

yarn add bootstrap@5.3.0-alpha1

RubyGems

在 Gemfile 中添加如下代码行，然后利用 Bundler (recommended) 和 RubyGems 在你的 Ruby 项目中安装 Bootstrap：

gem 'bootstrap', '~> 5.3.0-alpha1'

另外，如果你不使用 Bundler，则可以通过运行以下命令来安装 Bootstrap 的 gem 软件包：

gem install bootstrap -v 5.3.0-alpha1

有关详细信息，请参见 Bootstrap 的 gem 软件包的 README 文件。

Composer

你还可以利用 Composer 来安装并管理 Bootstrap 的 Sass 和 JavaScript 文件：

composer require twbs/bootstrap:5.3.0-alpha1

NuGet

如果你是 .NET 开发者，你还可以利用 NuGet 来安装并管理 Bootstrap 的 CSS 或 Sass 以及 JavaScript 文件。如果是新项目，建议使用 libman 或其它方式，因为 NuGet 并不是为管理前端资源而设计的。

Install-Package bootstrap

Install-Package bootstrap.sass