本文翻譯自 Boostrap 開發團隊官方博客。css
通過兩年的開發,咱們終於發佈了第一個 beta 版本的 Bootstrap 4。在此之間,咱們一共把代碼不折不扣搞砸了至少 27 次,提交了將近 5,000 個 commit,修改了 650+ 個文件,添加了 67,000 行代碼,又刪除了 82,000 行代碼。咱們發佈了 6 個 alpha 版本,三個官方主題甚至還有一個招聘版…… 終因而時候發佈 beta 版本了。git
Beta!?
長話短說,發佈一個 beta 版本意味着咱們在第 5 版以前不會再搞出超多的 bug 了。咱們都不是完美的,可是咱們也盡全力保證每個類、功能和文檔 URL 都不會再被移除或者改變。也就是說,可能會加功能,可是不會刪功能了。github
對於沒用過 alpha 版本的同窗們,這些是 v4 中值得注意的一些亮點:npm
- 從 Less 切換到 Sass。感謝 Libsass 框架和強大的 Sass 開發者社區,Boostrap 如今的編譯速度比之前都要快。
- Flexbox 和更加完善的網格系統。咱們幾乎把全部東西都挪到了 flexbox 裏,添加了一個更適合移動設備的網格等級,而且完全重構了咱們的源 Sass,使用了更優秀的變量、mixins 以及 maps。
- 放棄了 wells, thumbnails, 和 panels。卡片是 Bootstrap 一個全新的組成部分,它們可以完成前三者的任務,並且能作得更好。
- Fork 了 Normalize.css 而且將全部的 HTML resets 合併進一個全新的 CSS 模塊,Reboot。Normalize.css 目前的開發走向了咱們沒有預料到的方向,刪除了一些咱們長期以來依賴的核心 CSS 部件。Reboot 使用了 Normalize.css 的核心組成,並將其擴張從而包含更多的 resets,好比
box-sizing: border-box
,以及邊緣部件,所有放在一個 Sass 文件中。
- 添加了新的自定義選項。在 v3 中咱們讓開發者能夠選擇須要的漸變、過渡、陰影、網格等。在 v4 中,咱們把這些選項所有放在了 Sass 變量中。想使用默認過渡樣式而且禁用圓角圖標?修改一下變量從新編譯便可。
- 取消了對 IE8 和 IE9 以及其它高瀏覽器版本的支持,而且使用新的 CSS 特性。除了網格系統以外,咱們用 rem 和 em 替代了像素單位,從而使自適應字體和組成部分更加容易調節。若是你須要 IE8/IE九、Safari 8 如下版本、iOS 8 如下版本的支持,請移步 Bootstrap 3。
- 重寫了全部 JS 插件。用 ES6 重寫了全部插件從而支持最新的 JS 改進(包括新的 teardown, option type checking 等 method)。
- 利用 Popper.js 庫提升了工具框、彈窗和下拉菜單的自動調節位置特性。
- 從新設計並改進了文檔。從新設計,用 Markdown 重寫,而且加了一些好用的插件來流水線生成示例和代碼 snippets,讓開發者更容易地使用咱們的文檔。咱們也同時添加了一個新的超棒的搜索框。
- 新的 build 工具所有用 npm 腳本重寫,棄用 Grunt,讓 Bootstrap 項目的開發者們更加容易地爲項目進行貢獻。
- 還有更多!自定義表格控制,從新設計的走馬燈,重構的導航欄,新部件,還有更多更多……
想了解更多新功能?繼續閱讀,或者直接去看文檔吧!bootstrap
新外觀
咱們已經在 Bootstrap 4 的 alpha 版本中更新了一些外觀,可是最近咱們爲文檔頁面也更新了樣式。瀏覽器
Bootstrap 4 beta 文檔sass
除了新的調色板和系統字體,文檔也有了新的佈局。咱們還使用了超強的 Algolia 的 DocSearch 搜索功能、固定的導航欄和邊欄以及一個全新的目錄。app
更多關於 beta 版本的細節,能夠參考以下連接:框架
<3,
@mdo & team工具
譯者注:原文來自 Boostrap 開發團隊官方博客。詳情請見 Bootstrap 4 官方網站。