Bootstrap 最佳 UI 工具
當瀏覽一個網站時,最吸引眼球的是它的設計和頁面元素的佈局。它看起來很容易實現且吸引人,但設計帶來的痛苦只有設計師才能體會。市場上提供了許多 UI 工具包,可以透過提供現成的框架和佈局來幫助減少這種痛苦。
Twitter Bootstrap 是最流行的 HTML5 網頁框架之一,並已證明是穩定且使用最廣泛的框架。它非常易於實現和理解。Twitter Bootstrap 可以幫助使用包中提供的 CSS 和 JS 檔案建立漂亮的網頁。
基於 Twitter Bootstrap 的 UI 工具可以透過提供現成的圖形檔案、元件和 CSS 檔案來節省時間。本文將重點介紹使用 Bootstrap 的各種 UI 工具,並進行比較。其中一些工具可免費下載,還有一些是付費工具,提供各種皮膚和模板。
其中一些工具可免費下載,還有一些是付費工具,提供各種皮膚和模板。
Get Shit Done 工具包
Creative Tim 的 Get Shit Done 工具包是一個為 Bootstrap 3 設計的精美資源。Get Shit Done UI 工具包現代、簡潔、易於使用,並具有打造出色使用者介面的功能,提供了許多選項。Get Shit Done 工具包的專業版擁有超過 150 多個元件,但免費版只有大約 20 個元件。UI 工具包的元件完全獨特且新穎。設計質量非常流暢和真實,為網站帶來出色的外觀。專業版售價 40 美元。
Bootflat
Bootflat 也基於預設的 Bootstrap 樣式,併為其增添了一些額外的光彩。這個現代 UI 工具包包含一組精美的元件,可以為您的設計增添亮點。
Bootflat 中提供的顏色樣本、進度條和各種調整為您提供了簡潔的設計。
它可以自由選擇所需的元件,並可以放棄不需要的元件。它可以在 GitHub 上找到。
Tron
Tron 是一款現代 Bootstrap UI 工具包,它在 LESS(一種非常流行的 CSS 預處理器)的支援下構建而成,使 UI 工具包更具可擴充套件性和靈活性;LESS 允許您快速更改每個元件/元素的大小、形狀和顏色。
Tron 使用扁平化設計方案。由於 Bootstrap 本身已完全響應移動裝置,因此 Tron 也是如此,只是添加了觸控友好功能來擴充套件移動裝置的使用。
Paper Kit
Paper Kit 又是 Creative Tim 的另一個 UI 包,它是為 Bootstrap 構建的精美資源。我們使用淺色方案和紙質過渡重新設計了其所有元件。我們為這款新的 Bootstrap 皮膚及其自定義可能性感到自豪。
使用它非常簡單,它可以讓您重新整理應用程式的經典外觀。為了獲得預期的效果,您還需要整合 JS 外掛,這需要多一點努力,但很容易獲得。
Bootstrap Material Design
Bootstrap + Material Design 是一個致命的組合。BMD(Bootstrap Material Design)是一個將包含 Material Design 的 Bootstrap UI 工具包。事實證明,它也是所有選擇中最好的之一,兼具兩者的優點。
一些功能確實使這款皮膚脫穎而出,例如各個元素的動畫、獨特的元件,使網站感覺更原創和真實,但也將元素真正地融入網站設計本身,並帶來真正最先進的感覺。
BMD 不僅僅是一個皮膚,因為它不僅包含 Bootstrap 元件,還包含 Material Design 元件,例如 MD 調色盤、MD 載入動畫、MD 浮動操作按鈕 (FAB)、MD 表單輸入、MD 導航選項卡、MD 卡片、MD 提示訊息、MD 側邊欄選單。此外,它還具有動畫功能,幷包含啟動模板和文件。
隨著 Bootstrap 的普及,這些 UI 工具包也越來越受歡迎。Bootstrap 的發展非常明顯,隨著社群對 Bootstrap 4 釋出的期待,我們仍然有足夠的時間和機會從頭開始學習該框架。更多 UI 工具包正在湧現,為我們的網頁提供更多功能和設計特性。