---
# System prepended metadata

title: 第 5 章 Bootstrap5教學 - 理解框架知識、各種安裝方式、自定義
tags: [Bootstrap 5 開發秘技｜極速開發電商網站 UI]

---

# 第 5 章 Bootstrap5教學 - 理解框架知識、各種安裝方式、自定義

###### tags: `Bootstrap 5 開發秘技｜極速開發電商網站 UI`

**CDN安裝原始碼**：https://github.com/scps960740/bs5_intro_cdn
**Webpack安裝原始碼**：https://github.com/scps960740/bs5_intro_webpack

**為什麼會需要CSS框架？**

- 套用組件，增加開發速度
- 解決多瀏覽器樣式不同的問題
- 統一產品的設計規範與風格

**為什麼使用Bootstrap？**

- 加快前端開發速度
- 快速套用各種UI組件
- 開發內部的後台系統
- 客戶能夠接受BS的設計風格
- 自家產品能以BS當作主要的設計風格

**Bootstrap5 vs 4**

- Vanilla JavaScript為主，慢慢取代jQuery
- 瀏覽器支援 – 移除對IE10和IE11的支援
- 調色板擴展更多顏色可以選擇
- 統一表單組件在各個瀏覽器的UI顯示
- Utility API自定義
- 網格系統升級，新的xxl、Gutter使用rem
- 新的offcanvas組件
- RTL 支援
- SVG iCON庫









