Bootstrap團隊發布了(le)Bootstrap5的(de)正式版本

jQuery 和(hé) JavaScript

Bootstrap 5 不再依賴 jQuery。該團隊表示，删除 jQuery 是框架多(duō)年來(lái)最大(dà)的(de)變化(huà)之一。十多(duō)年來(lái)，jQuery 允許訪問複雜(zá)的(de) JavaScript 行爲，但是随著(zhe)時(shí)間的(de)推移，前端開發工具和(hé)浏覽器支持有了(le)新的(de)進步，因此這(zhè)變得(de)不再需要。删除 jQuery 依賴項将導緻文件更小并提高(gāo)頁面加載速度。

v5 中的(de) JavaScript 進行了(le)其他(tā)一些更改和(hé)增強，這(zhè)些更改和(hé)增強側重于代碼質量并彌合 v4 和(hé) v5 之間的(de)鴻溝。更大(dà)的(de)變化(huà)之一是放棄了(le) Button 插件的(de)大(dà)部分(fēn)，而僅使用(yòng) HTML 和(hé) CSS 來(lái)切換狀态。現在，切換按鈕由複選框和(hé)單選按鈕提供動力，并且更加可(kě)靠。

 

CSS 自定義屬性

由于放棄了(le)對(duì) Internet Explorer 的(de)支持，其已經開始在 Bootstrap 5 中使用(yòng) CSS 自定義屬性。先前版本的(de) Bootstrap 僅具有用(yòng)于顔色和(hé)字體的(de) CSS 選項，現在将添加對(duì)其他(tā)組件和(hé)布局選項的(de)支持。

 

改進的(de)自定義文檔

目前，已經在多(duō)個(gè)地方進行了(le)改進，提供了(le)更多(duō)的(de)解釋，消除了(le)歧義，并爲擴展 Bootstrap 提供了(le)更多(duō)的(de)支持。v5 的(de)“自定義”文檔在 v4 的(de)“主題”頁面上進行了(le)擴展，提供了(le)更多(duō)内容和(hé)代碼段，可(kě)用(yòng)于在 Bootstrap 的(de)源 Sass 文件頂部構建。開發團隊在此處充實了(le)更多(duō)内容，甚至提供了(le)一個(gè) starter npm 項目，可(kě)讓用(yòng)戶更快(kuài)更輕松地開始使用(yòng)。

其也(yě)在 v5 中擴展了(le)調色闆。借助内置的(de)廣泛顔色系統，用(yòng)戶可(kě)以更輕松地自定義應用(yòng)程序的(de)外觀，而無需離開代碼庫。還(hái)改善色彩對(duì)比度，甚至在色彩文檔中提供了(le)色彩對(duì)比度指标。

 

更新表格

對(duì)“表單”文檔和(hé)組件進行了(le)全面修訂。已經将所有表單樣式合并到一個(gè)新的(de) Forms 部分(fēn)（包括輸入組組件）中，以給予他(tā)們應有的(de)重視。除了(le)新的(de)文檔頁面，還(hái)重新設計和(hé)删除了(le)所有表單控件的(de)重複數據。

該團隊表示：“每個(gè)複選框、單選框、選擇框、文件、範圍等等都包含自定義外觀，以統一跨 OS 和(hé)浏覽器的(de)表單控件的(de)樣式和(hé)行爲。這(zhè)些新的(de)表單控件都是基于完全語義化(huà)的(de)标準表單控件構建的(de)，不再需要多(duō)餘的(de)标記，而僅是表單控件和(hé)标簽。”

 

實用(yòng)程序 API

Bootstrap 5還(hái)引入了(le)新的(de)實用(yòng)程序 API，可(kě)用(yòng)于創建實用(yòng)程序以及修改或删除由Bootstrap創建的(de)實用(yòng)程序。“對(duì)于那些通(tōng)過我們的(de)源文件在 Bootstrap 上進行構建的(de)人(rén)來(lái)說，這(zhè)将改變遊戲規則，如果您尚未以這(zhè)種方式構建由 Bootstrap 驅動的(de)項目，那麽您将大(dà)爲震驚。”

 

增強型網格系統

網格系統也(yě)發生了(le)一些變化(huà)。其将大(dà)部分(fēn)構建系統（不包括 jQuery）保留在适當的(de)位置，并且基于現有的(de)網格系統進行了(le)構建，而不是将其替換爲更新的(de)樣式。

 

以下(xià)是網格中更改内容的(de)摘要：

添加了(le)一個(gè)新的(de)網格層。

.gutter 類已被 .g* 實用(yòng)程序代替，就像 margin/padding實用(yòng)程序一樣。還(hái)爲網格裝訂線間距添加了(le)與間距實用(yòng)程序匹配的(de)選項。

表單布局選項已被新的(de)網格系統替換。

垂直間距類已添加。

默認情況下(xià)，Columns 不再 position: relative。

 

此外，Bootstrap 團隊還(hái)在探索一些新的(de)功能，包括 RTL、offcanvas 菜單、Sass 模塊系統、對(duì) CSS 自定義屬性的(de)更多(duō)使用(yòng)以及将 SVG 嵌入 HTML 而不是 CSS 中。