bootstrap4的案例分析

這篇文章主要介紹了bootstrap4的案例分析，具有一定借鑒價值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

Bootstrap 曾經風頭無兩，是人們入門前端的首選 CSS 框架，很多寫后端的程序員的 side project 也經常使用它來搭建項目主頁、demo 等等。

歷經三年開發，前端框架 Bootstrap 4 正式發布了。然而今天的 Web 世界已經和當初 Mark Otto 發布 Bootstrap 時的情況大為不同，一些開發者由此質疑它的更新是否還有意義。

V4 版本的主要更新有：

改進的網格系統（默認情況下為 Flexbox）

現在使用 Sass（取代了 Less）

不支持 IE8、IE9 和 iOS 6

重寫 JavaScript 插件

現在使用 rem 取代了 px。

準備從 V3 版本升級的開發人員需要先做測試，可能還要解決一些問題。新版整體上和舊版接近，但多了一些突破性的變化。下面的遷移指南列出了變化內容的詳情：

https://getbootstrap.com/docs/4.0/migration/#by-component

Bootstrap 的優勢之一是其網格系統。這一系統為網頁提供了一種可聲明的方式來渲染網格系統中的內容，不需要額外的步驟就能使流式內容兼容桌面端和移動端。

Bootstrap 4 的網格系統使用的是幾乎所有的現代瀏覽器都支持的 flexbox。因為引入了這一更新等原因，新版只支持 IE10 以上和 iOS7 以上。如果項目仍需兼容舊式瀏覽器，開發人員就要繼續使用 Bootstrap 3。但是，Bootstrap 3 的維護已經在 2016 年結束了。

Bootstrap 最初于 2011 年發布，當初是作為 Twitter 的一個產品誕生的，號稱是“世界上最流行的 HTML、CSS 和 JS 庫”，但其增長趨勢如今似乎已經到頭了。Dan Tao 等人曾批評 Boostrap 的緊耦合和缺乏語義的缺陷：

最早看來很棒的一堆開發組件，如今演變成了堆積如山的技術債務。開發者的 HTML 充斥著帶有 Bootstrap 特定屬性的深度嵌套結構。

V4 的第一個 alpha 版本發布于 2015 年 8 月，兩年后發布了第一個 beta 版本。但 Bootstrap 4 是否生不逢時？它的網格系統是最大的賣點之一，但主流瀏覽器普遍采用 CSS 網格，意味著 Bootstrap 4 新引入的，基于 flexbox 的網格已經過時了。

Natalya Shelburne 是紐約時報的一位軟件工程師，她認為 CSS 網格才是未來：

CSS 網格不是什么黑客工具，它是一個很好的 web 布局工具。什么都不用安裝，也不需要預處理器，更用不著為了理解它的運作機制而絞盡腦汁。

此外，Ryan Oglesby 則認為，使用基于組件的樣式技術（如經常與 React 或 Vue.js 一起使用的技術），就不需要傳統的“全局 CSS”技術了：

在 React 或 Vue.js 等 UI 庫的幫助下，現代 Web 應用程序體系結構已經采用了松耦合，高內聚的組件，這些組件通常將 HTML，CSS 和 JavaScript 放在同一個文件中。

當然，如果開發者想要做一些美觀漂亮、運行迅速的內容，Bootstrap 的 JavaScript 插件（比如 Popover 和 Form 控件）仍是首選的框架。

感謝你能夠認真閱讀完這篇文章，希望小編分享bootstrap4的案例分析內容對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，遇到問題就找億速云，詳細的解決方法等著你來學習!