bootstrap Web前端UI框架 v5.3.3官方版

bootstrap是當(dāng)下非常受歡迎的用于快速開發(fā)Web應(yīng)用程序和網(wǎng)站的web前端框架，是基于 HTML、CSS、JAVASCRIPT，由 Mark Otto 和 Jacob Thornton 開發(fā)，屬于強(qiáng)大、可擴(kuò)展、功能豐富的前端開發(fā)工具包，提供的功能包括：基于 Sass 進(jìn)行編譯和定制、內(nèi)置的網(wǎng)格系統(tǒng)和組件、強(qiáng)大的 JavaScript 插件等。目前bootstrap已經(jīng)包含了貫穿于整個(gè)庫的移動(dòng)設(shè)備優(yōu)先樣式，支持所有的主流瀏覽器，且容易上手，用戶只需知道HTML和CSS的基礎(chǔ)知識就可以使用bootstrap，最大的特點(diǎn)是響應(yīng)式的CSS能夠自適應(yīng)各種PC、平板、手機(jī)等移動(dòng)設(shè)備。

小編覺得以前做網(wǎng)站的時(shí)候前端一般都用Dreamweaver設(shè)計(jì)，對于基礎(chǔ)差的小白來說腳本那一塊太神煩啦！但是現(xiàn)在用bootstrap Web前端UI框架，它不僅有基本的模板，而且提供了超級多可復(fù)用的組件、插件，并且還有先進(jìn)的柵格系統(tǒng)?？傊珺ootstrap讓前端開發(fā)變得更加快速、簡單。讓所有的開發(fā)者都能快速上手、所有的設(shè)備都可以適配、所有的項(xiàng)目都適用。ps：這里小編帶來的是bootstrap框架下載，軟件包包括了bootstrap v3、bootstrap v4和bootstrap v5，請用戶根據(jù)需求選擇使用。

bootstrap v3、v4、v5重要區(qū)別如下：

1、Bootstrap v3

支持 IE8+ 瀏覽器

不依賴 jQuery

2、Bootstrap v4

支持 IE10+ 瀏覽器

支持 Flexbox 布局

不依賴 jQuery

3、Bootstrap v5

支持 Flexbox 布局

支持 Grid 布局

支持 CSS 自定義屬性

不依賴 jQuery

不支持 IE 瀏覽器

軟件功能

1、優(yōu)化CSS樣式：

頁面排版優(yōu)化、表格優(yōu)化設(shè)計(jì)、表單優(yōu)化設(shè)計(jì)、按紐設(shè)計(jì)、圖片和圖標(biāo)設(shè)計(jì)

2、使用Bootstrap組件：

下拉菜單、按紐組、按紐式下拉菜單、導(dǎo)航、導(dǎo)航條、面包屑和分頁、標(biāo)簽和徽章、縮略圖、警告框、進(jìn)度條、媒體、版式、其他組件

3、使用JavaScript插件：

模態(tài)對話框、下拉項(xiàng)、滾動(dòng)監(jiān)聽、標(biāo)簽頁、工具提示、彈出提示、警告框、按紐、折疊、輪播、輸入提示、附加導(dǎo)航

4、Bootstrap擴(kuò)展：

針對IE6、IE7的擴(kuò)展、Bootstarp Metro、顏色選擇器、日期選擇器、jQuery UI Bootstrap

bootstrap框架使用說明

1、安裝 Bootstrap

通過 npm、Composer、或者 Meteor，可以將 Bootstrap 的 Sass 和 JavaScript 源碼安裝到本地。

通過軟件包管理工具所安裝的 Bootstrap 是不包含文檔以及完整的構(gòu)建腳本的。你還可以 利用我們提供的 npm 工程模板源碼倉庫 快速生成一個(gè) Bootstrap 項(xiàng)目。

$ npm install bootstrap

$ gem install bootstrap -v 4.6.2

2、BootCDN

如果你只是需要使用 Bootstrap 的預(yù)編譯 CSS 或 JS 文件，你可以直接使用 BootCDN 提供的免費(fèi) CDN 加速服務(wù)。

通過我們提供的這些簡單的 入門模板 或 瀏覽這些示例 以便幫助你快速啟動(dòng)一個(gè)新項(xiàng)目。你還可以選擇引入 Popper.js 和我們提供的 各個(gè)獨(dú)立的 JS 文件。

3、Bootstrap 圖標(biāo)庫

Bootstrap 有史以來第一次擁有自己的開源 SVG 圖標(biāo)庫，旨在配合我們的組件和文檔一起使用。

Bootstrap 圖標(biāo)庫旨在與 Bootstrap 組件配合使用，但它們也可以使用到任何項(xiàng)目中。這些圖標(biāo)是 SVG 格式的，因此它們可以被快速輕松地縮放、可以通過多種方式使用、并且可以使用 CSS 設(shè)置樣式。

4、官方主題

官方 Bootstrap 主題市場 提供了許多高級主題，讓 Bootstrap 提升到了一個(gè)新的水平。

這些主題是基于 Bootstrap 構(gòu)建的，并作為他們自己的擴(kuò)展框架，包含了豐富的新組件和插件、文檔以及構(gòu)建工具。

軟件特色

1、預(yù)處理工具

雖然可以直接使用 Bootstrap 提供的 CSS 樣式表，但是不要忘記，Bootstrap 的源碼是采用最流行的 CSS 預(yù)處理工具 Less 和 Sass 開發(fā)的。你可以直接采用預(yù)編譯的 CSS 文件快速開發(fā)，也可以從 Bootstrap 源碼自定義自己需要的樣式。

2、一個(gè)框架、多種設(shè)備。

你的網(wǎng)站和應(yīng)用能在 Bootstrap 的幫助下通過同一份源碼快速、有效地適配手機(jī)、平板和 PC 設(shè)備，這一切都是 CSS 媒體查詢（Media Query）的功勞。

3、功能完備

Bootstrap 提供了全面、美觀的文檔，你能在這里找到關(guān)于普通 HTML 元素、HTML 和 CSS 組件以及 jQuery 插件方面的所有詳細(xì)文檔。

更新日志

v5.3.3版本

一、集錦

1、修復(fù)了使用Sass構(gòu)建Bootstrap時(shí)，需要手動(dòng)導(dǎo)入variables-dark.css的顏色模式帶來的突破性變化?，F(xiàn)在，_variables.scss將自動(dòng)導(dǎo)入_variables-dark.scss。如果你已經(jīng)手動(dòng)導(dǎo)入_variables-dark.scss，你應(yīng)該繼續(xù)這樣做，因?yàn)樗粫茐娜魏螙|西，而且將是v6中的做法。

2、修復(fù)了選擇器引擎中無法再處理多個(gè)ID的回歸問題。

二、顏色模式

1、徽章現(xiàn)在使用.text bg-*text實(shí)用程序來確保文本始終可讀（特別是在淺色和深色模式下自定義顏色不同時(shí)）。

2、修復(fù)了我們的color-models.js腳本，以處理操作系統(tǒng)設(shè)置為燈光模式而網(wǎng)站上使用自動(dòng)顏色模式的情況。如果您從我們的文檔中復(fù)制了腳本，則應(yīng)將此更改應(yīng)用于您自己的腳本。

3、修正了顏色模式文檔中的配色方案描述，顯示colorschema（）只接受亮值和暗值作為參數(shù)。

三、其他

1、消毒劑中允許存在<dl>、<dt>和<dd>。

2、模態(tài)和非畫布標(biāo)題的項(xiàng)目分布均勻。

3、修復(fù)了手風(fēng)琴CSS選擇器，以避免嵌套手風(fēng)琴時(shí)的繼承問題。

4、修復(fù)了驗(yàn)證聲明表單控件的焦點(diǎn)框陰影。

5、修復(fù)了聚焦環(huán)在聚焦復(fù)選按鈕上的問題。

6、修復(fù)了產(chǎn)品示例移動(dòng)導(dǎo)航欄切換。

7、更改了轉(zhuǎn)盤控件圖標(biāo)的RTL處理。

四、文件

1、刪除了不必要的右邊距，例如代碼塊。

2、修復(fù)了背景實(shí)用程序示例部分中強(qiáng)調(diào)文本實(shí)用程序的使用。

3、添加了關(guān)于如何渲染默認(rèn)展開的手風(fēng)琴的技術(shù)說明。

4、在Vite指南中更改了Vite配置路徑導(dǎo)入。

5、增強(qiáng)了.card img-*類的卡圖像描述。

6、在Sass自定義頁面的tint-color（）和shade-color（）中提到了shift-color（）函數(shù)。

7、在Cheatsheet示例導(dǎo)航按鈕中添加了缺失的type=“button”屬性。

8、更新了自定義頁面中的顏色表，使其具有響應(yīng)性。