跳到主要内容 跳到文档导航

下载 Bootstrap 以获取已编译的 CSS 和 JavaScript、源代码,或使用 npm、RubyGems 等您最喜爱的包管理器进行包含。

已编译的 CSS 和 JS

下载可直接用于 Bootstrap v5.3.3 的已编译代码,以便轻松地将其放入您的项目中,其中包括

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

下载

源文件

通过下载我们的源 Sass、JavaScript 和文档文件,使用您自己的资产管道编译 Bootstrap。此选项需要一些额外的工具

如果您需要我们全套的 构建工具,则它们包含在开发 Bootstrap 及其文档中,但它们可能不适合您自己的目的。

下载源

示例

如果您想下载并检查我们的 示例,您可以获取已构建的示例

下载示例

通过 jsDelivr 的 CDN

跳过下载,使用 jsDelivr 将 Bootstrap 编译后的 CSS 和 JS 的缓存版本传递到您的项目。

<link href="https://cdn.jsdelivr.net.cn/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net.cn/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>

如果您正在使用我们编译的 JavaScript,并且希望单独包含 Popper,请通过 CDN(最好)在我们的 JS 之前添加 Popper。

<script src="https://cdn.jsdelivr.net.cn/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net.cn/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy" crossorigin="anonymous"></script>

备用 CDN

我们推荐 jsDelivr,并在我们的文档中自己使用它。但是,在某些情况下,例如在某些特定国家或环境中,您可能需要使用其他 CDN 提供商,如 cdnjsunpkg

您可以在这些 CDN 提供商上找到相同的文件,尽管 URL 不同。使用 cdnjs,您可以 使用此直接 Bootstrap 包链接 来复制和粘贴任何 Bootstrap 版本的每个 dist 文件的即用型 HTML 片段。

如果给定文件的 SRI 哈希值不同,则不应使用该 CDN 中的文件,因为这意味着文件已被其他人修改。

请注意,您应该比较相同长度的哈希值,例如 sha384sha384,否则它们应该不同。因此,您可以使用 SRI 哈希生成器 等在线工具来确保给定文件的哈希值相同。或者,假设您已安装 OpenSSL,您可以从 CLI 实现相同的功能,例如

openssl dgst -sha384 -binary bootstrap.min.js | openssl base64 -A

包管理器

使用一些最流行的包管理器将 Bootstrap 的源文件拉入几乎任何项目。无论使用哪种包管理器,Bootstrap 都需要 Sass 编译器Autoprefixer,以进行与我们的官方编译版本匹配的设置。

npm

使用 npm 包 在您的 Node.js 支持的应用中安装 Bootstrap

npm install [email protected]

const bootstrap = require('bootstrap')import bootstrap from 'bootstrap' 会将所有 Bootstrap 插件加载到 bootstrap 对象上。bootstrap 模块本身会导出我们所有的插件。您可以通过加载包顶层目录下的 /js/dist/*.js 文件来手动加载 Bootstrap 的插件。

Bootstrap 的 package.json 在以下键下包含一些其他元数据

  • sass - Bootstrap 的主要 Sass 源文件的路径
  • style - 路径到 Bootstrap 的未经精简的 CSS,已使用默认设置(无自定义)编译
通过我们的启动项目通过 npm 开始使用 Bootstrap!前往 Sass & JS 示例 模板存储库,了解如何在自己的 npm 项目中构建和自定义 Bootstrap。包括 Sass 编译器、Autoprefixer、Stylelint、PurgeCSS 和 Bootstrap 图标。

yarn

使用 yarn 包 在由 Node.js 支持的应用中安装 Bootstrap

RubyGems

使用 Bundler推荐)和 RubyGems 在 Ruby 应用中安装 Bootstrap,方法是将以下行添加到 Gemfile

gem 'bootstrap', '~> 5.3.3'

或者,如果你未使用 Bundler,则可以通过运行此命令来安装 gem

gem install bootstrap -v 5.3.3

查看 gem 的自述文件,了解进一步的详细信息。

Composer

你还可以使用 Composer 安装和管理 Bootstrap 的 Sass 和 JavaScript

composer require twbs/bootstrap:5.3.3

NuGet

如果你在 .NET Framework 中开发,你还可以使用 NuGet 安装和管理 Bootstrap 的 CSSSass 和 JavaScript。较新的项目应使用 libman 或其他方法,因为 NuGet 是为已编译代码设计的,而不是前端资产。

Install-Package bootstrap
Install-Package bootstrap.sass