下載 Bootstrap 以取得已編譯的 CSS 和 JavaScript、原始程式碼,或使用你最愛的套件管理員(例如 npm、RubyGems 等)將其包含在其中。

已編譯的 CSS 和 JS

下載適用於 Bootstrap v4.6.2 的即用型已編譯程式碼,輕鬆放入你的專案中,其中包括

此處不包含文件、原始檔案或任何選用的 JavaScript 相依性(jQuery 和 Popper)。

下載

原始檔案

透過下載我們的 Sass、JavaScript 和文件原始檔案,使用你自己的資產管線編譯 Bootstrap。此選項需要一些額外的工具

如果你需要我們的 建置工具 完整組,它們已包含在 Bootstrap 及其文件開發中,但它們可能不適合你自己的目的。

下載原始檔案

範例

如果你想下載並檢視我們的 範例,你可以取得已建置好的範例

下載範例

jsDelivr

使用 jsDelivr 跳過下載,將 Bootstrap 編譯後的 CSS 和 JS 的快取版本傳送到您的專案。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>

如果您使用我們的編譯 JavaScript 並偏好個別包含 Popper,請在我們的 JS 之前加入 Popper,最好透過 CDN。

<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>

套件管理員

使用一些最受歡迎的套件管理員,將 Bootstrap 的原始檔案拉進幾乎任何專案。不論套件管理員為何,Bootstrap 都會需要 Sass 編譯器Autoprefixer,以設定與我們的官方編譯版本相符。

npm

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

npm install bootstrap

require('bootstrap') 會將所有 Bootstrap 的 jQuery 外掛載入 jQuery 物件。bootstrap 模組本身不會匯出任何東西。您可以手動載入 Bootstrap 的 jQuery 外掛,方法是在套件頂層目錄中載入 /js/*.js 檔案。

Bootstrap 的 package.json 包含一些額外的元資料,位於下列金鑰下

  • sass - Bootstrap 主要 Sass 原始檔案的路徑
  • style - Bootstrap 未壓縮 CSS 的路徑,已使用預設設定 (無自訂) 預先編譯
使用我們的入門專案透過 npm 開始使用 Bootstrap!前往 twbs/bootstrap-npm-starter 範本儲存庫,瞭解如何在您自己的 npm 專案中建置和自訂 Bootstrap。包含 Sass 編譯器、Autoprefixer、Stylelint、PurgeCSS 和 Bootstrap 圖示。

yarn

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

yarn add bootstrap

RubyGems

使用 Bundler (建議) 和 RubyGems 在您的 Ruby 應用程式中安裝 Bootstrap,方法是將下列程式碼行加入您的 Gemfile

gem 'bootstrap', '~> 4.6.2'

或者,如果您未使用 Bundler,您可以執行此命令來安裝 gem

gem install bootstrap -v 4.6.2

查看 gem 的 README 以取得更多詳細資料。

Composer

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

composer require twbs/bootstrap:4.6.2

NuGet

如果您使用 .NET 開發,您也可以使用 NuGet 安裝和管理 Bootstrap 的 CSSSass 和 JavaScript

Install-Package bootstrap
Install-Package bootstrap.sass