Skip to main content
Bootstrap

使用 Bootstrap 快速建立響應式網站

使用全球最流行的前端開發工具 Bootstrap,快速設計及自定義響應式網站,其擁有豐富的 Sass 變數與 mixins、響應式網格系統、大量預設元件以及強大的 JavaScript 插件。

目前版本 v5.1.1 · v4.6.x docs · All releases

六角學院的 Bootstrap 5 課程上線囉,立即與萬人一同學習最專業、最深入的 Bootstrap 5 課程。

立即上課去

如何安裝

通過 npm、Composer 或 Meteor 安裝 Bootstrap 的 Sass 和 JavaScript 原始碼。

透過套件管理安裝的檔案,並不包含 Bootstrap 文件或編譯後的檔案。 因此你也可以使用我們放在 npm 上的範例儲存庫 並來通過 npm 快速建立一個 Bootstrap 專案

閱讀安裝文件
npm install bootstrap
gem install bootstrap -v 5.1.1

jsDelivr

如果你只是需要使用 Boostrap 的 CSS 或是 JS,那麼你可以考慮使用 jsDelivr

透過簡單的 快速開始模板 或者是範例模板以快速建立一個專案。當然你也可以選擇有包含 Popper 的 JS 或者是只有 Bootstrap 的 JS。

探索文件
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script>

Bootstrap Icons

有史以來第一次 Boostrap 有了自己的開源 SVG icon 庫,這個 SVG icon 將會非常適合我們的元件與文件。

Bootstrap Icons 的設計宗旨在於與 Bootstrap 元件一起使用,當然它也可以在其他專案上使用。由於它是一個 SVG 檔案,因此可以非常快速且方便的擴展,可以透過各種方式來實現,也可以使用 CSS 來給予樣式設置。

取得 Bootstrap Icons
Bootstrap Icons

官方主題

透過 Bootstrap 官方主題商城中的高級主題可以讓 Bootstrap 提升到另一個境界。

主題是基於 Bootstrap 而擴展的框架,擁有豐富的元件、插件、文件以及強大的建構工具。

瀏覽主題
Bootstrap Themes