Bootstrap

Bootstrap是一組用於網站和網絡應用程序開發的開源前端（所謂“前端”，指的是展現給最終用戶的界面。與之對應的“後端”是在服務器上面運行的代碼）框架，包括HTML、CSS及JavaScript的框架，提供字體排印、表單、按鈕、導航及其他各種元件及Javascript擴充套件，旨在使動態網頁和Web應用的開發更加容易。
Bootstrap是GitHub上面被標記為“Starred”次數排名第四多的項目。Starred次數超過133,000，而分支次數超過了65,000次。

**起源**
Bootstrap原名Twitter Blueprint，由Twitter的Mark Otto和Jacob Thornton編寫，本意是製作一套可以保持一致性的工具和框架。在Bootstrap之前，開發界面需要使用不同的代碼庫，這樣很容易導致不一致的問題，從而增加了維護的負擔。Twitter開發者Mark Otto說：
經過一個小組幾個月之後的努力，Twitter的許多開發者把它當作Hack Week（在Twitter開發者中流行的類似於黑客松的一星期）的一部分，開始參與開發。大家把Twitter Blueprint改名為Bootstrap，並且在2011年8月19日將其作為開源項目發佈。 此後項目繼續由Mark Otto、Jacob Thornton和一個核心開發小組維護，此外還有眾多來自社區的貢獻者。
在2012年1月31日，Bootstrap 2發佈。這一版增加了十二列網格佈局和響應式組件，並且對許多組件進行了修改。 Bootstrap 3於2013年8月19日發佈，開始將移動設備優先作為方針，並且開始使用扁平化設計。
2015年4月23日，Mark Otto宣佈正在開發Bootstrap 4。Bootstrap 4的第一個alpha版本部署在2015年8月19日。
2021年5月5日，Bootstrap 5正式發佈。

**功能**
Bootstrap與最新版的Google Chrome、Firefox、Internet Explorer、Opera和Safari瀏覽器兼容，儘管有些瀏覽器並不是支持所有操作系統。
從2.0版本開始，Bootstrap支持響應式網頁設計(RWD)。頁面佈局可以根據顯示網頁的設備（桌面、平板電腦、手機）來進行動態調整。
從3.0版本開始，Bootstrap將移動設備優先作為設計方針，更加強調了響應式設計。
從 4 版本開始，添加Sass和Flexbox的支持，更重要的是加入了utilities CSS 的新概念。
從 5 版本開始，不支援IE，脫離了jQuery的依賴，大大提升原生 JavaScript 及各前端框架的支援，並更加完善了無障礙的相關輔助。
Bootstrap是開源軟件，可以從GitHub上面找到。開發者被鼓勵參與項目，並且對項目做出自己的貢獻。

**結構和功能**
Mozilla Firefox渲染的Bootstrap示例頁面
Bootstrap採用模塊化設計，並且用LESS樣式表語言來實現各種組件和工具。一個名為bootstrap.less的文件包括了這些組件和工具，開發者可以修改這個文件，自行決定項目需要哪些組件。
通過一個基本配置文件可以進行有限的定製，此外也可以進行更加深入的定製。
LESS語言支持變量、函數、運算符、組合選擇器和一個叫做Mixin（混入）的功能。
從Bootstrap 2.0開始，Bootstrap文檔包括一個叫做“自定義”的特別選項，開發者可以根據自己的實際需要來選擇包含的組件和效果，然後生成和下載已經編譯好的包。
網格系統和響應式設計以1170像素寬為基準。此外開發者也可以自定義基準。這兩種情況下，Bootstrap都能提供四種變體：手機豎屏、手機橫屏和平板電腦、PC低分辨率、高分辨率，每個變體都會自動調整網格寬度。

**CSS**
Bootstrap對一系列HTML組件的基本樣式進行了定義，並且為文本、表格和表單元素設計了一套獨特的、現代化的樣式。

**可重用組件**
除了基本HTML元素，Bootstrap還包括了其他常用的界面元素，例如帶有高級功能的按鈕（例如按鈕組合、帶有下拉菜單選項的按鈕、導航欄、水平和垂直標籤組、導航、分頁等等）、標籤、高級排版、縮略圖、警告信息、進度條等。
這些組件都使用CSS的類實現。在頁面中需要將其對應到特定的HTML元素上面。

**JavaScript組件**
通過jQuery，Bootstrap加入了一些JavaScript組件。它們提供了例如對話框、工具提示、輪播等功能。此外還增強了一些用戶界面元素的功能，例如輸入框的自動完成。Bootstrap 2.0支持以下JavaScript插件：Modal（模態對話框）、Dropdown（下拉菜單）、Scrollspy（滾動監聽）、Tab（標籤頁）、Tooltip（工具提示）、Popover（浮動提示）、Alert（警告）、Button（按鈕）、Collapse（摺疊）、Carousel（輪播）、Typeahead（輸入提示）、Affix（附加導航）。

**Sass和Less支持**
Sass 和Less都是CSS預處理器，它們允許開發者使用變量、嵌套、混入等高級功能來更輕鬆地編寫和維護CSS代碼。Sass 代表語法很棒的樣式表。Sass 是 CSS 的擴展，完全兼容所有版本的 CSS，並減少了CSS 的重複，從而節省了時間。Sass 由 Hampton Catlin 設計，由 Natalie Weizenbaum 於 2006 年開發。Less代表精簡樣式表。Less 只對 CSS 語言做了一些方便的補充，因此它是較為容易學習的。
Bootstrap提供了基於Sass和Less的源文件，使開發者能夠使用這些預處理器。使用Sass或Less，開發者可以修改變量、覆蓋默認樣式、添加自定義組件和樣式，以滿足特定項目的需求。這種支持使得Bootstrap更加靈活，開發者可以根據項目的要求自定義Bootstrap的樣式。

**Bootstrap 圖標庫**
Bootstrap v5第一次擁有自己的開源 SVG 圖標庫，旨在與 Bootstrap 組件配合使用，但它們也可以使用到任何項目中。這些圖標是 SVG 格式的，因此它們可以被快速輕鬆地縮放、可以通過多種方式使用、並且可以使用 CSS 設置樣式。

**官方主題**
官方 Bootstrap 主題市場提供了許多高級主題，讓 Bootstrap 提升到了一個新的水平。這些主題是基於 Bootstrap 構建的，並作為他們自己的擴展框架，包含了豐富的新組件和插件、文檔以及構建工具。

**參見**
 CSS框架- 響應式網頁設計 (RWD)- CSS- HTML- JavaScript- jQuery

**參考文獻**

**外部鏈接**
  Bootstrap官方網站date=20141226085427  - 包括文檔和下載-  Bootstrap繁體中文網站 - 由陳傳興維護，包括Bootstrap3網站的繁體中文翻譯版本，以及相關的框架-  date=20210326235347 -Bootstrap5繁體中文網站(由六角學院翻譯)-  Bootstrap簡體中文網站date=20150804075040  - 由社區維護，包括Bootstrap網站的簡體中文翻譯版本，以及相關的框架-  Bootstrap Blogdate=20170522214854  - 由開發者Mark Otto維護的官方日誌-  Bootstrap文檔手冊實例網date=20180529121819  - Bootstrap查找文檔和GitHub實例-  Bootstrap 用戶界面套件date=20200722004859  - Bootstrap響應式頁面模板，佈局，組件和小部件，可快速構建網頁。