跳到主要內容 跳到文件導覽
在 GitHub 上檢視

下載

下載 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/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>

如果您正在使用我們已編譯的 JavaScript，並且偏好將 Popper 分開包含，請在我們的 JS 之前加入 Popper，最好透過 CDN。

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

其他 CDN

我們推薦 jsDelivr，並在我們的文件中使用它。但是，在某些情況下（例如在某些特定國家或環境中），您可能需要使用其他 CDN 提供者，例如 cdnjs 或 unpkg。

您可以在這些 CDN 提供者上找到相同的檔案，儘管 URL 不同。使用 cdnjs，您可以 使用這個直接的 Bootstrap 套件連結 複製並貼上每個 dist 檔案的即用型 HTML 片段，適用於任何版本的 Bootstrap。

如果給定檔案的 SRI 雜湊值不同，您不應該使用該 CDN 的檔案，因為這表示該檔案已被其他人修改。

請注意，您應該比較相同長度的雜湊，例如 sha384 和 sha384，否則預期它們會不同。因此，您可以使用線上工具，例如 SRI Hash Generator，以確保給定檔案的雜湊相同。或者，假設您已安裝 OpenSSL，您可以從 CLI 達到相同的目的，例如

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

套件管理員

使用一些最受歡迎的套件管理員，將 Bootstrap 的原始檔拉進幾乎任何專案中。無論使用哪個套件管理員，Bootstrap 都需要 Sass 編譯器 和 Autoprefixer，才能設定與我們的官方編譯版本相符的設定。

npm

使用 npm 套件 在您的 Node.js 驅動的應用程式中安裝 Bootstrap

npm install bootstrap@5.3.3

const bootstrap = require('bootstrap') 或 import bootstrap from 'bootstrap' 會將所有 Bootstrap 的外掛程式載入到 bootstrap 物件中。bootstrap 模組本身會匯出我們所有的外掛程式。您可以手動載入 Bootstrap 的外掛程式，方法是在套件頂層目錄下載入 /js/dist/*.js 檔案。

Bootstrap 的 package.json 在以下金鑰下包含一些額外的元資料

  • sass - Bootstrap 主要 Sass 原始檔的路徑
  • style - Bootstrap 未壓縮 CSS 的路徑，使用預設設定編譯（無自訂設定）
使用我們的入門專案透過 npm 開始使用 Bootstrap！前往 Sass & JS 範例 範本儲存庫，瞭解如何在您自己的 npm 專案中建置和自訂 Bootstrap。包含 Sass 編譯器、Autoprefixer、Stylelint、PurgeCSS 和 Bootstrap Icons。

yarn

使用 yarn 套件 在您的 Node.js 驅動的應用程式中安裝 Bootstrap

yarn add bootstrap@5.3.3

RubyGems

使用 Bundler（推薦）和 RubyGems 在 Ruby 應用程式中安裝 Bootstrap，方法是將下列程式碼行加入 Gemfile

gem 'bootstrap', '~> 5.3.3'

或者，如果你沒有使用 Bundler，你可以執行此命令來安裝 gem

gem install bootstrap -v 5.3.3

參閱 gem 的 README 以取得進一步的詳細資訊。

Composer

你也可以使用 Composer 來安裝和管理 Bootstrap 的 Sass 和 JavaScript

composer require twbs/bootstrap:5.3.3

NuGet

如果你在 .NET Framework 中開發，你也可以使用 NuGet 來安裝和管理 Bootstrap 的 CSS 或 Sass 和 JavaScript。較新的專案應使用 libman 或其他方法，因為 NuGet 是針對已編譯的程式碼設計，而非前端資產。

Install-Package bootstrap

Install-Package bootstrap.sass